我试图通过 $scope 和 $rootScope 访问姓名和年龄,但即使我觉得我做的一切正确,也会出现错误。有人可以帮我看看错误在哪里吗?
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular-route.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<a href="#/one">One</a><a href="#/two">Two</a>
<ng-view></ng-view>
<script>
//app declaration
var app = angular.module("myApp",['ngRoute']);
//routing
app.config(['$routeProvider',function($routeProvider){
$routeProvider
.when('/one',{templateUrl:'one.html'})
.when('/two',{templateUrl:'two.html'})
.otherwise({templateUrl:'one.html'});
}]);
//config
app.run(['rootScope', function($rootScope){
$rootScope.age = 25;
}]);
//controller
app.controller('myCtrl',function($scope, $rootScope){
$scope.name = "Peter";
});
</script>
</body>
</html>
one.html
ONE => {{name}},{{age}}
two.html
TWO => {{name}},{{age}}
更新错误:
最佳答案
您可以在 docs 中看到,第一个参数应该是一个函数
run(function(injectables) { // instance-injector
// This is an example of a run block.
// You can have as many of these as you want.
// You can only inject instances (not Providers)
// into run blocks
});
但是在你的代码中
app.run('rootScope',function($rootScope,$state){
第一个参数是字符串而不是函数。
所以,只需删除它,或者如果您想在数组中使用可注入(inject)语法包装
app.run(['$rootScope','$state',function($rootScope,$state){...}]}
但似乎您还有另一个错误:使用 $state 提供程序,但此提供程序不是 ngRoute
模块的一部分,而是 ui-router< 的一部分/em>.不管怎样,当运行 block 执行时,当前的路线可以不被定义。
没有多余的工作样本
//app declaration
var app = angular.module("myApp", ['ngRoute']);
//routing
app.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/one', {
template: '<div>one: {{name}} | {{age}}</div>'
})
.when('/two', {
template: 'two: {{name}} | {{age}}'
})
.otherwise({
redirectTo: '/one'
});
}]);
//config
app.run(function($rootScope) {
$rootScope.age = 25;
});
//controller
app.controller('myCtrl', function($scope, $rootScope) {
$scope.name = "Peter";
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.5/angular-route.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<ng-view></ng-view>
</div>
关于javascript - $rootScope 未在简单的 AngularJs 路由示例中呈现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42898795/