【问题标题】:How to share a service between two controllers in different modules如何在不同模块中的两个控制器之间共享服务
【发布时间】:2015-02-26 09:13:15
【问题描述】:

我需要在两个控制器之间移动。 控制器位于不同的模块中。 我如何在他们之间共享服务?

例子:

var app1 = angular.module('Module1', []);

app1.controller('FirstController', function ($scope,mutualService) {

//Doing things
});

var app2 = angular.module('Module2', []);

app2.controller('SecondController', function ($scope,mutualService) {

//Doing things
});

现在我还创建了一个服务,但我不明白如何正确编写它。

{???}.service('mutualService', function() {

    this.myObject = new MyObject();
});

我不知道在 {???}.service 中放置什么。 我不能放置 app1 或 app2 因为另外两个人不知道? 我错了吗?

【问题讨论】:

标签: angularjs angularjs-scope controllers


【解决方案1】:

是的,你可以。您只需将服务模块设置为两个控制器模块的依赖项。

第一:

var serviceModule = angular.module('ServiceModule', []);
serviceModule.service('MutualService', function() {

    this.myObject = new MyObject();
});

然后:

var app2 = angular.module('Module2', ['ServiceModule']);

【讨论】:

    【解决方案2】:

    你可以在模块中导入模块:

    var app1 = angular.module('Module1', []);
    
    app.controller('FirstController', function ($scope,mutualService) {
    
    //Doing things
    });
    
    var app2 = angular.module('Module2', ['Module1']);
    
    app.controller('SecondController', function ($scope,mutualService) {
    
    //Doing things
    });
    
    app1.service...
    

    【讨论】:

      【解决方案3】:

      您可以通过注入其模块在所有控制器和要使用它的应用程序之间共享一个服务。然后在任何地方定义和调用你的函数。

      注意:您必须在这里做一些解决方法,因为您不能在同一个模板中拥有两个应用程序 -> Link

      运行我的代码示例以在两个不同的应用程序中调用服务函数,这会触发两个警报:

      // define app1 and app2 and inject services module
      var app = angular.module('app', ['app1', 'app2']),
          app1 = angular.module('app1', ['services']),
          app2 = angular.module('app2', ['services']);
      
      angular.module('services', []).factory('mutualService', function() {
        // define service functions here
        var sampleFunc = function(str) {
          alert(str);
        };
        return {
          sampleFunc: sampleFunc
        };
      });
      
      // injecting mutualService into Ctrl1
      app1.controller('Ctrl1', function(mutualService) {
        // call service function
        mutualService.sampleFunc('Ctrl1');
      });
      
      // injecting mutualService into Ctrl2
      app2.controller('Ctrl2', function(mutualService) {
        // call service function
        mutualService.sampleFunc('Ctrl2');
      });
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
      
      <div ng-app="app">
        <div ng-controller="Ctrl1"></div>
        <div ng-controller="Ctrl2"></div>
      </div>

      【讨论】:

        【解决方案4】:

        在不同的模块上编写服务,您可以将此模块作为依赖项传递给所有模块,无论您想要什么......

        var serviceModule = angular.module('ServiceModule', []);
        serviceModule.service('MutualService', function() {
        
            this.myObject = new MyObject();
        });
        

        例如: var app = angular.module('Module', ['ServiceModule']);

        否则在任何一个模块上编写服务并将该模块作为依赖项传递给下一个模块,并且不要忘记在控制器中注入服务..

        这个答案可能会对你有所帮助....

        【讨论】:

          猜你喜欢
          • 2017-11-23
          • 2017-01-03
          • 1970-01-01
          • 1970-01-01
          • 2016-09-04
          • 1970-01-01
          • 1970-01-01
          • 2015-09-30
          相关资源
          最近更新 更多