我一直在学习 Angular，现在我已经学习了一段时间了，我决定制作一个小应用程序来测试我的知识，但是我的应用程序上的链接和嵌套 View 似乎不起作用，原因是我还不能理解，我使用了 angular-ui-router 因为它处理路由之类的东西非常棒。
问题:我试图将路线模板加载到包含 ui-view 的 div 中，但它不起作用。
我有这三个js文件:
第一个config.route.js
'use strict';
angular.module('weekobApp', ['ui.router'])
.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/');
$stateProvider
// route for the home page
.state('app', {
url:'/',
views: {
'header': {
templateUrl : 'app/layout/header.html',
},
'content': {
templateUrl : 'app/layout/dashboard.html',
controller : 'DashboardController'
},
'footer': {
templateUrl : 'app/layout/footer.html',
}
}
});
});
dashboard.js
'use strict';
angular.module('weekobApp', [])
.controller('DashboardController', ['$scope', function ($scope) {
$scope.myname = "Dashboard";
}]);
最后是 html 文件:
<!DOCTYPE html>
<html ng-app="weekobApp">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
<!-- build:css content/styles/style.css -->
<link href="content/styles/style.css" rel="stylesheet" />
<!-- endbuild -->
</head>
<body>
<div ui-view="header"></div>
<div ui-view="content"></div>
<div ui-view="footer"></div>
<!-- build:js app/main.js -->
<script src="../../bower_components/angular/angular.min.js"></script>
<script src="../../bower_components/angular-ui-router/release/angular-ui-router.min.js"></script>
<script src="../../bower_components/angular-resource/angular-resource.min.js"></script>
<!-- Dashboard modules -->
<script src="app/dashboard/config.route.js"></script>
<script src="app/dashboard/dashboard.js"></script>
<!-- endbuild -->
</body>
</html>
最佳答案
您应该只声明一次模块依赖项列表:
angular.module('weekobApp', ['ui.router']);
angular.module('weekobApp')
.config(function($stateProvider, $urlRouterProvider) {
angular.module('weekobApp')
.controller('DashboardController', ['$scope', function ($scope) {
第一行创建模块。另外两个将组件添加到模块中。您的代码覆盖了之前的组件。
关于javascript - Angular UI Router 不渲染嵌套 View 和链接，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34637900/