所以我们可以像我这样在角度html中使用范围变量:
<!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从我希望做的范围使用:
<h1>Hello {{yourName}} you are in in {{$rootScope.zoneName}}!</h1>
有可能$rootScope像这样带变量吗？
Nik*_*wal 84
您不需要$rootScope在html中指定.您可以像使用$scope变量一样使用它
刚刚更新
<h1>Hello {{yourName}} you are in in {{$rootScope.zoneName}}!</h1>
至
<h1>Hello {{yourName}} you are in in {{zoneName}}!</h1>
GPi*_*azo 81
这应该工作:
<h1>Hello {{yourName}} you are in in {{$root.zoneName}}!</h1>
zea*_*hco 11
你可以注入$rootScope你的控制器,然后将它映射到这样的范围变量
$scope.global = $rootScope;
然后在您可以使用的模板中
<p>$rootscope value of name is {{ global.name }}.</p>
你必须小心不要无用地把东西放进去,$rootScope因为它不被认为是调制代码的最佳实践
Hou*_*oui 11
我知道这已经晚了,但需要一个很好的解释!
Angular 1.x世界中的任何View 都将自动并且默认情况下新的$ scope这样的$ scope将从$ rootScope扩展,因此本地$ scope将继承$ 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>
请检查This Plunker,解释一下!