Question

假设我的应用程序有一个变量“globalFruits”，可以跟踪我的应用程序中的所有“水果”。

var globalFruits = {}

globalFruits ['Pear'] = {name：'Pear'，color：'green'}; globalFruits ['Apple'] = {name：'Apple'，color：'Blue'};

如何将这个全局变量包含在我的AngularJS应用程序中，以便我可以拥有可以调用它并检查其状态的指令或作用域？或者那不是AngularJS的方式吗？

Answer 1

您可以为模块定义 value ：

app.value('globalFruits', {
  Pear: {name:'Pear', color:'green'},
  Apple: {name:'Apple', color:'Blue'}
);

然后，您可以在使用它时注入此值：

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

Answer 2

有一个$rootScope模型可以用于那样的事情

app.config(['$rootScope', function ($rootScope) {
    $rootScope.fruits = [
        {name:'Pear', color:'green'},
        {name:'Apple', color:'Blue'}
    ];
}]);

您可以在HTML视图中照常使用：

<ul>
    <li ng-repeat="fruit in fruits">{{ fruit.name }}</li>
</ul>

要在浏览器中调试范围变量，您可能需要为Google Chrome安装并使用AngularJS Batarang扩展名。

更多信息：http://docs.angularjs.org/guide/scope

如何正确包含全局变量并在Angular JS中更新它们？

2 个答案: