AngularJS routeprovider 没有被调用
AngularJS routeprovider is not called
我在 AngularJS 中搜索了很多关于路由的信息,并在 Whosebug 上看到了问题,例如 this 1, this 2, this 3, this 4。然而,没有结果。
我添加了 AngularJS 1.5.8.js
和 angular-route.js
。
HTML:
<!doctype html>
<html ng-app="employeesApp">
<head>
<title>Injecting view</title>
</head>
<body >
<p>Hey! View should be injected between these statements</p>
<div ng-view></div>
<p>Hey! View should be injected between these statements</p>
<script src="scripts/angular.js"></script>
<script src="scripts/angular-route.js"></script>
<script src="app/app.js"></script>
<script src="app/controllers/employeesController.js"> </script>
</body>
</html>
Employees.html:
<h2>Employees</h2>
<article>This is employee view!:)</article
employeesController.js:
(function()
{
var employeesController=function($scope, foo, bar) {//THIS CODE SNIPPET IS NOT CALLED
alert('a1');
debugger;
$scope.sortBy='name';
$scope.reverse=false;
$scope.employees= [
{joined:'2010-12-02', name:'Jon', city:'Reading', orderTotal:49.9956},
{joined:'1995-01-25', name:'Ben', city:'Las Vegas', orderTotal:519.99},
{joined:'1994-06-15', name:'Joseph', city:'New York', orderTotal:344.99},
{joined:'1998-03-18', name:'Adam', city:'Seattle', orderTotal:1021.5}
];
$scope.doSort=function(propName){
$scope.sortBy = propName;
$scope.reverse=!$scope.reverse;
};
};
employeesController.$inject=['$scope'];
angular.module('employeesApp',[]).controller('employeesController',
employeesController);
}());
app.js:
(function() {
debugger; //this code snippet works
var app=angular.module('employeesApp',['ngRoute']); //this code snippet works
app.config(function($routeProvider){ //THIS CODE SNIPPET IS NOT CALLED
alert('in');
debugger;
$routeProvider
.when('/', {
templateUrl: 'app/views/employees.html',
controller: 'employeesController'
})
.otherwise( { redirectTo: '/' });
});
}());
我仔细检查了所有指令和代码,但是 employee.html
没有被注入。
有人知道我做错了什么吗?我正在使用 AngularJS 1.5.8.js
.
我看到的唯一问题是您正在控制器中重新定义 employeesApp
angular.module('employeesApp', []).controller('employeesController', employeesController);
省略[]部分
angular.module('employeesApp').controller('employeesController', employeesController);
您只需定义一次模块。使用 angular.module('modulename', arrayofdependencies or empty array)
在其他任何地方,您只需使用 getter 语法获取模块并添加部件,即控制器、指令等。不要在这里使用数组。 angular.module('modulename').controller
我在 AngularJS 中搜索了很多关于路由的信息,并在 Whosebug 上看到了问题,例如 this 1, this 2, this 3, this 4。然而,没有结果。
我添加了 AngularJS 1.5.8.js
和 angular-route.js
。
HTML:
<!doctype html>
<html ng-app="employeesApp">
<head>
<title>Injecting view</title>
</head>
<body >
<p>Hey! View should be injected between these statements</p>
<div ng-view></div>
<p>Hey! View should be injected between these statements</p>
<script src="scripts/angular.js"></script>
<script src="scripts/angular-route.js"></script>
<script src="app/app.js"></script>
<script src="app/controllers/employeesController.js"> </script>
</body>
</html>
Employees.html:
<h2>Employees</h2>
<article>This is employee view!:)</article
employeesController.js:
(function()
{
var employeesController=function($scope, foo, bar) {//THIS CODE SNIPPET IS NOT CALLED
alert('a1');
debugger;
$scope.sortBy='name';
$scope.reverse=false;
$scope.employees= [
{joined:'2010-12-02', name:'Jon', city:'Reading', orderTotal:49.9956},
{joined:'1995-01-25', name:'Ben', city:'Las Vegas', orderTotal:519.99},
{joined:'1994-06-15', name:'Joseph', city:'New York', orderTotal:344.99},
{joined:'1998-03-18', name:'Adam', city:'Seattle', orderTotal:1021.5}
];
$scope.doSort=function(propName){
$scope.sortBy = propName;
$scope.reverse=!$scope.reverse;
};
};
employeesController.$inject=['$scope'];
angular.module('employeesApp',[]).controller('employeesController',
employeesController);
}());
app.js:
(function() {
debugger; //this code snippet works
var app=angular.module('employeesApp',['ngRoute']); //this code snippet works
app.config(function($routeProvider){ //THIS CODE SNIPPET IS NOT CALLED
alert('in');
debugger;
$routeProvider
.when('/', {
templateUrl: 'app/views/employees.html',
controller: 'employeesController'
})
.otherwise( { redirectTo: '/' });
});
}());
我仔细检查了所有指令和代码,但是 employee.html
没有被注入。
有人知道我做错了什么吗?我正在使用 AngularJS 1.5.8.js
.
我看到的唯一问题是您正在控制器中重新定义 employeesApp
angular.module('employeesApp', []).controller('employeesController', employeesController);
省略[]部分
angular.module('employeesApp').controller('employeesController', employeesController);
您只需定义一次模块。使用 angular.module('modulename', arrayofdependencies or empty array)
在其他任何地方,您只需使用 getter 语法获取模块并添加部件,即控制器、指令等。不要在这里使用数组。 angular.module('modulename').controller