我想ngRoute
在我的 angularjs 项目中实现。但<ng-view></ng-view>
不显示任何东西。我阅读了有关此问题的所有其他帖子,但我的问题没有解决。
我$routeProvider
在 app.js 文件中定义如下:
'use strict'
angular.module('confusionApp', ['ngRoute'])
.config(['$routeProvider',function($routeProvider) {
$routeProvider
.when('/contactus', { // route for the contactus page
templateUrl : 'contactus.html', controller : 'ContactController'
})
.when('/menu', { // route for the menu pag
templateUrl : 'menu.html', controller : 'MenuController'
})
.when('/menu/:id', { // route for the dish details pag
templateUrl : 'dishdetail.html', controller : 'DishDetailController'
})
.otherwise('/contactus');
}]);
我的 controllers.js 文件包含了我所有控制器的定义:
angular.module('confusionApp',[])
.controller('MenuController',['$scope','menuFactory',function($scope,menuFactory){
$scope.dishes = menuFactory.getDishes();
//other codes which deleted for simplicity
}])
.controller('dishDetailController',['$scope','$routeParams',
'menuFactory', function($scope,$routeParams,menuFactory){
var dish = menuFactory.getDish(parseInt($routeParams.id,10));
this.dish = dish;
//other codes which deleted for simplicity
}])
.controller('contactController',['$scope',function($scope){
//some code here
}])
.controller('feedbackController',['$scope',function($scope){
//some code here
}]);
我在 services.js 文件中定义了工厂,如下所示:
angular.module('confusionApp')
.factory('menuFactory',function(){
var menufac = {};
var dishes=[{... some data ...}];
menufac.getDishes = function(){
return dishes;
};
menufac.getDish = function(index){
return dishes[index];
};
return menufac;
});
在我的 index.html 页面<ng-view></ng-view>
中没有显示任何内容。此外,我在 index.html 中定义脚本如下,并且所有路径都是正确的。
<script src="../bower_components/angular/angular.min.js"></script>
<script src="../bower_components/angular-route/angular-route.min.js"></script>
<script src="scripts/app.js"></script>
<script src="scripts/controllers.js"></script>
<script src="scripts/services.js"></script>
谁能帮我?非常感谢。