2016-07-31 3 views
0

Все каталоги настроены отлично, но все же маршрутизация не работает. Папка «содержит две страницы« addOrder.html »и« showOrder.html ». Я также включил файл 'angular.min.js', но все равно никаких результатов. Маршрут не работает в angularJS

//Define an angular module for our app 
 
var sampleApp = angular.module('sampleApp', []); 
 

 
//Define Routing for app 
 
//Uri /AddNewOrder -> template add_order.html and Controller AddOrderController 
 
//Uri /ShowOrders -> template show_orders.html and Controller AddOrderController 
 
sampleApp.config(['$routeProvider', 
 
    function($routeProvider) { 
 
    $routeProvider. 
 
     when('/AddNewOrder', { 
 
\t \t templateUrl: 'templates/add_order.html', 
 
\t \t controller: 'AddOrderController' 
 
\t }). 
 
     when('/ShowOrders', { 
 
\t \t templateUrl: 'templates/show_orders.html', 
 
\t \t controller: 'ShowOrdersController' 
 
     }). 
 
     otherwise({ 
 
\t \t redirectTo: '/AddNewOrder' 
 
     }); 
 
}]); 
 

 

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

 

 
sampleApp.controller('ShowOrdersController', function($scope) { 
 

 
\t $scope.message = 'This is Show orders screen'; 
 

 
});
<!DOCTYPE html> 
 
<html lang="en"> 
 
    <head> 
 
    <title>AngularJS Routing example</title> 
 
    </head> 
 

 
    <body ng-app="sampleApp"> 
 

 
    <div class="container"> 
 
\t \t <div class="row"> 
 
\t \t <div class="col-md-3"> 
 
\t \t \t <ul class="nav"> 
 
\t \t \t \t <li><a href="#AddNewOrder"> Add New Order </a></li> 
 
\t \t \t \t <li><a href="#ShowOrders"> Show Order </a></li> 
 
\t \t \t </ul> 
 
\t \t </div> 
 
\t \t <div class="col-md-9"> 
 
\t \t \t <div ng-view></div> 
 
\t \t </div> 
 
\t \t </div> 
 
    </div> 
 
\t <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> 
 
\t <script src="app.js"></script> 
 
    </body> 
 
</html>

+0

Каковы ошибки в консоли браузера? –

ответ

0

Вы должны включать в себя angular.route.js как маршрут был разделен на другой модуль. Как указано в docs,

<script src="path/to/angular.js"></script> 
<script src="path/to/angular-route.js"></script> 
0

Вы должны добавить файл маршрут ресурса из "HTTP // ajax.googleapis.com/Ajax/LIBS/angularjs/XYZ/угловые-route.js"

, а затем в вашем модуле

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