2016-07-31 5 views
0

Alle Verzeichnisse sind perfekt eingerichtet, aber Routing funktioniert nicht. Seiten 'Ordner' enthalten zwei Seiten 'addOrder.html' und 'showOrder.html'. Ich habe auch Datei 'angular.min.js' aufgenommen, aber immer noch keine Ergebnisse. Route funktioniert nicht in 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

Was sind die Fehler in der Browser-Konsole? –

Antwort

0

würden Sie angular.route.js enthalten müssen als der Weg in ein anderes Modul getrennt wurde. Wie in der docs zitiert,

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

Sie müssen Route Ressourcendatei von "http // ajax.googleapis.com/ajax/libs/AngularJS/XYZ/Winkel route.js"

hinzufügen

und dann in Ihrem Modul

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