[英]Configure routes angular for menu
與angular js中的路由配置混淆。 我想學習如何配置它,並且不導入每個html文件的所有依賴項。
這是我不想擁有的foreach文件:
<script src="../../resources/jquery/jquery.min.js"></script>
<link rel="stylesheet" href="../../resources/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" href="../../resources/toastr/toastr.min.css" />
<script src="../../resources/angular/angular.min.js"></script>
<script src="../../resources/bootstrap/js/bootstrap.min.js"></script>
<script src="../../resources/toastr/toastr.min.js"></script>
<script src="../services/book.service.js"></script>
<script src="controllers/book.controller.js"></script>
1-我的appConfig.js具有路線:
var app = angular.module("library.crud", ["ngRoute"]);
app.config(['$routeProvider', '$locationProvider',
function ($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'app/views/home.html',
controller: 'homeController',
controllerAs: 'vm'
})
.when('/book', {
templateUrl: 'app/views/book.html',
controller: 'bookController',
controllerAs: 'vm'
})
.when('/books', {
templateUrl: 'app/views/books.html',
controller: 'booksController',
controllerAs: 'vm'
})
.otherwise({
redirectTo: '/'
})
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
}]);
如何使用appConfig文件?
我的索引菜單:
<html ng-app="library.crud">
<script src="appConfig.js"> </script>
<body ng-app="library.crud">
<a href="#/books">books</a>
<a href="#/book">book</a>
<div ng-view></div>
</body>
</html>
我的索引文件不起作用,並顯示以下消息:“ injector moduler etc ...”
這本來應該是評論,但我需要50分的聲譽。
您需要將angular-route.js
文件添加到頁面。
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-route.js"></script>
請小心使用的AngularJS版本,以上僅為示例。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.