Я хочу реализовать ngRoute
в моем проекте angularjs. Но <ng-view></ng-view>
ничего не показывает. Я прочитал все другие сообщения об этой проблеме, но моя проблема не решена.С помощью ngRoute 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 файл включает Defenition всех моих контроллеров:
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>
Может кто мне помочь? Большое спасибо.
вы переосмысление своего модуля: 'Angu lar.module ('confusionApp', []) 'вместо' angular.module ('confusionApp') 'в вашем контроллере.js? – DTing
angular.module ('confusionApp', []) переопределит новый модуль в вашем контроллере. Поэтому вам нужно использовать angular.module ('confusionApp') .... это утверждение выводит ваш угловой модуль. – Hemakumar
Спасибо @DTing. Ваше руководство было правильным. :-) – sahar