在我的html中使用rootScopevariables
所以我们可以像这样轻松地在我们的angular html中使用scopevariables:
<!doctype html> <html ng-app> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script> </head> <body> <div> <label>Name:</label> <input type="text" ng-model="yourName" placeholder="Enter a name here"> <hr> <h1>Hello {{yourName}}!</h1> </div> </body> </html> 举个例子:
 <h1>Hello {{yourName}}!</h1> 
 正在使用yourName希望做的范围中的yourName : 
 <h1>Hello {{yourName}} you are in in {{$rootScope.zoneName}}!</h1> 
 是否有可能像这样带来$rootScopevariables? 
 你不需要在html中指定$rootScope 。 您可以像使用$scopevariables一样使用它 
只是从更新
 <h1>Hello {{yourName}} you are in in {{$rootScope.zoneName}}!</h1> 
至
 <h1>Hello {{yourName}} you are in in {{zoneName}}!</h1> 
这应该工作:
 <h1>Hello {{yourName}} you are in in {{$root.zoneName}}!</h1> 
 您可以在您的控制器中注入$rootScope ,然后将其映射到像这样的作用域variables 
 $scope.global = $rootScope; 
然后在你的模板中,你可以使用
 <p>$rootscope value of name is {{ global.name }}.</p> 
 你必须小心,不要无用地把东西放到$rootScope因为它不被认为是调整你的代码的最佳实践 
我知道这是晚了,但需要一个很好的解释!
在Angular 1.x世界中的任何视图都会自动创build,默认情况下, $ scope这个$ scope将被扩展到$ rootScope,所以本地$ scope将inheritance$ rootScope存储的所有东西,并且会拥有它自己的版本的数据。
因此,如果您在$ rootScope级别中有任何信息,那么默认情况下会有该信息,因此您的视图可以使用通常的插值直接访问它。
这行代码将显示如何!
 var app = angular.module('plunker', []); app.run(function($rootScope) { $rootScope.persons = [ { name : "Houssem", role : "Developer Advocate" }, { name: "Clark", role: "Developer" } ]; }) app.controller('MainCtrl', function($scope) { $scope.greetings = 'Hello World !'; }); 
这在索引页面上:
 <!DOCTYPE html> <html ng-app="plunker"> <head> <meta charset="utf-8" /> <title>AngularJS Plunker</title> <link rel="stylesheet" href="style.css" /> <script data-require="angular.js@1.0.x" src="https://code.angularjs.org/1.0.8/angular.js" data-semver="1.0.8"></script> <script data-require="ui-router@1.0.0-alpha.5" data-semver="1.0.0-alpha.5" src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.0-alpha.5/angular-ui-router.js"></script> <script src="app.js"></script> </head> <body ng-controller="MainCtrl"> <p>{{greetings}}</p> <ul> <li ng-repeat="person in persons"> <p>{{person.name}} - {{person.role}}</p> </li> </ul> </body> </html> 
请检查一下这个解释器!