如何在Angular中使用$ rootScope来存储variables?

如何使用$rootScope将variables存储在控制器中,我想稍后在另一个控制器中访问? 例如:

 angular.module('myApp').controller('myCtrl', function($scope) { var a = //something in the scope //put it in the root scope }); angular.module('myApp').controller('myCtrl2', function($scope) { var b = //get var a from root scope somehow //use var b }); 

我将如何做到这一点?

在根范围设置的variables可以通过原型inheritance而用于控制器范围。

下面是@ Nitish演示的修改版本,它显示了一些更清晰的关系: http : //jsfiddle.net/TmPk5/6/

请注意,rootScope的variables是在模块初始化时设置的,然后每个inheritance的范围都得到自己的可以独立设置的副本( changefunction)。 此外,rootScope的值也可以更新( changeRs中的changeRs函数)

 angular.module('myApp', []) .run(function($rootScope) { $rootScope.test = new Date(); }) .controller('myCtrl', function($scope, $rootScope) { $scope.change = function() { $scope.test = new Date(); }; $scope.getOrig = function() { return $rootScope.test; }; }) .controller('myCtrl2', function($scope, $rootScope) { $scope.change = function() { $scope.test = new Date(); }; $scope.changeRs = function() { $rootScope.test = new Date(); }; $scope.getOrig = function() { return $rootScope.test; }; }); 

在控制器之间共享数据是工厂/服务非常有用的。 简而言之,它就是这样的。

 var app = angular.module('myApp', []); app.factory('items', function() { var items = []; var itemsService = {}; itemsService.add = function(item) { items.push(item); }; itemsService.list = function() { return items; }; return itemsService; }); function Ctrl1($scope,items) { $scope.list = items.list; } function Ctrl2($scope, items) { $scope.add = items.add; } 

你可以在这个小提琴中看到一个工作的例子: http : //jsfiddle.net/mbielski/m8saa/

 angular.module('myApp').controller('myCtrl', function($scope, $rootScope) { var a = //something in the scope //put it in the root scope $rootScope.test = "TEST"; }); angular.module('myApp').controller('myCtrl2', function($scope, $rootScope) { var b = //get var a from root scope somehow //use var b $scope.value = $rootScope.test; alert($scope.value); // var b = $rootScope.test; // alert(b); }); 

DEMO

我发现没有理由这样做$ scope.value = $ rootScope.test;

$ scope已经从$ rootScopeinheritance了原型。

请看这个例子

 var app = angular.module('app',[]).run(function($rootScope){ $rootScope.userName = "Rezaul Hasan"; }); 

现在你可以在应用标签的任何地方绑定这个范围variables。

首先将值存储在$ rootScope中

 .run(function($rootScope){ $rootScope.myData = {name : "nikhil"} }) .controller('myCtrl', function($scope) { var a ="Nikhilesh"; $scope.myData.name = a; }); .controller('myCtrl2', function($scope) { var b = $scope.myData.name; )} 

$ rootScope是所有$ scope的父级,每个$ scope都会收到$ rootScope数据的副本,您可以使用$ scope自己访问这些副本。

如果只是“在其他控制器访问”,那么你可以使用angular常量的好处是, 您可以添加一些全局设置或您希望在应用程序中访问的其他内容

 app.constant('appGlobals', { defaultTemplatePath: '/assets/html/template/', appName: 'My Awesome App' }); 

然后像访问它:

 app.controller('SomeController', ['appGlobals', function SomeController(config) { console.log(appGlobals); console.log('default path', appGlobals.defaultTemplatePath); }]); 

(没有testing)

更多信息: http : //ilikekillnerds.com/2014/11/constants-values-global-variables-in-angularjs-the-right-way/

http://astutejs.blogspot.in/2015/07/angularjs-what-is-rootscope.html

  app.controller('AppCtrl2', function ($scope, $rootScope) { $scope.msg = 'SCOPE'; $rootScope.name = 'ROOT SCOPE'; }); 

有多种方法可以实现这一点:

1..run方法中添加$rootScope

 .run(function ($rootScope) { $rootScope.name = "Peter"; }); // Controller .controller('myController', function ($scope,$rootScope) { console.log("Name in rootscope ",$rootScope.name); OR console.log("Name in scope ",$scope.name); }); 

2.创build一个服务并在两个控制器中访问它。

 .factory('myFactory', function () { var object = {}; object.users = ['John', 'James', 'Jake']; return object; }) // Controller A .controller('ControllerA', function (myFactory) { console.log("In controller A ", myFactory); }) // Controller B .controller('ControllerB', function (myFactory) { console.log("In controller B ", myFactory); })