如何创建一个具有可在AngularJS中的控制器之间共享的属性的对象?

时间:2014-03-28 10:44:49

标签: javascript angularjs angularjs-service

这是How to create this global constant to be shared among controllers in Angularjs?

的后续问题

提供的答案允许在控制器之间共享一个恒定的$ webroot。

app = angular.module('myApp', []);
app.constant('$webroot', 'localhost/webroot/app');

app.controller('myController', ['$scope', '$webroot', function($scope, $webroot) {
  $scope.webroot = $webroot;
}]);

然而,问题是如果我有10个常数,那么所有10个常数都必须注入控制器。这使得控制器声明看起来很长而且很丑陋。 如何创建一个具有可在AngularJS中的控制器之间共享的属性的对象?这样,我只需要注入一个对象而不是多个常量。这可以在Angularjs中完成吗?感谢。

3 个答案:

答案 0 :(得分:5)

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

app.constant('config', {
  prop1: 'val1',
  prop2: 'val2',
  ...
});

app.controller('Ctrl', ['config', function(config) {
  console.log(config.prop1);
  console.log(config.prop2);
  ...
}]);

答案 1 :(得分:2)

您可以使用工厂:

app = angular.module('myApp', []);
app.factory('MyGlobals', function() {
  return {
    globalOne: 12345,
    globalTwo: 'Hey there',
    globalThree: {foo: 'bar'},
    globalFour: [1, 2, 3, 4],
    isFoo: function () {
      return (this.globalTwo == 'Foo' ? true : false);
    }
  }
});

app.controller('myController', ['$scope', 'MyGlobals', function($scope, MyGlobals) {
  $scope.globalOne = MyGlobals.globalOne
  [...]
  if (MyGlobals.isFoo()) {
    // Be creative
  }
}]);

答案 2 :(得分:2)

您可以通过多种方式在不同控制器之间共享对象或变量 -

  1. 使用工厂

  2. 使用服务

  3. 广播或发出

  4. 如果您的要求只是在多个控制器之间共享变量,则可以使用服务来实现此目的。

    创建如下服务 - 这里的名称是sharedService。您可以使用自己的服务名称。然后使用'这个'来定义/声明变量。关键字(你想要的很多)。

        var app = angular.module('app', []);
    
        app.service('sharedService', function ($rootScope) {
        this.globalvar1 = "my global variable1";
        this.globalvar2="";
        });
    

    在控制器中注入服务,然后访问服务变量,如下所示

     app.controller('myController', ['$scope', 'sharedService',
        function ($scope,sharedService) {
        var myGlobalVariable=sharedService.globalvar1;
        sharedService.globalvar1="my global variable value changed from controller";
        }]);
    

    您可以在所有控制器中使用服务变量,但必须在控制器中注入服务名称