2014-09-06 3 views
0

Я изучаю, как перемещаться по страницам.
Вот моя страница HTMLRouteProvider не работает

<html lang="en"> 

AngularJS Пример маршрутизации

<body data-ng-app="sampleApp"> 


<div class="container"> 
    <div class="row"> 
    <div class="col-md-3"> 
     <ul class="nav"> 
      <li><a href="#AddNewOrder"> Add New Order </a></li> 
      <li><a href="#ShowOrders"> Show Order </a></li> 
     </ul> 
    </div> 
    <div> 
     <div data-ng-view></div> 
    </div> 
    </div> 
</div> 



</body> 


<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.min.js"></script>  

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-route.js"></script> 
<script src="rout.js"></script> 

rout.js где я написал все configuringn часть.

var sampleApp = angular.module("sampleApp", []); 

sampleApp.config(['$routeProvider', 
    function($routeProvider) { 
    $routeProvider. 
     when('/AddNewOrder', { 
     templateUrl: '/add_order.html', 
     controller: 'AddOrderController' 
    }). 
     when('/ShowOrders', { 
     templateUrl: '/show_orders.html', 
     controller: 'ShowOrdersController' 
     }). 
     otherwise({ 
     redirectTo: '/route-paging.html' 
     }); 
}]); 

sampleApp.controller('AddOrderController', function($scope) { 
    $scope.message = 'This is Add new order screen'; 
}); 


sampleApp.controller('ShowOrdersController', function($scope) { 
    $scope.message = 'This is Show orders screen'; 
}); 

Это одна из ходовой страницы add_order.html

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Insert title here</title> 
</head> 
<body> 
<h2>Add New Order</h2> 

{{ message }} 
</body> 
</html> 

Других страницы Show_orders.html

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Insert title here</title> 
</head> 
<body> 
<h2>Show Orders</h2> 

{{ message }} 
</body> 
</html> 

Я взял этот этот код из примера. Та же функциональность была проверена мной. Но не сработало. Любой знает, где может быть неправильно.

ответ

1

AngularJS переместил свой материал routerProvider на отдельный модуль с версии 1.2, называемой ngRoute. Так что, если вы используете версию 1.2 или более позднюю версию, вы должны включать в себя дополнительный JS файл (то есть угловой route.min.js) и ввести модуль

var sampleApp = angular.module("sampleApp", ['ngRoute']); 
+0

Благодаря Патрику ... он работал .. Даже в учебнике , он не упоминался. Вы сэкономили мое время. Кажется, что могут произойти значительные изменения в обновлениях дополнительной версии. –

Смежные вопросы