angularjs和ui路线上的新手！试图让一个基本的ui路由器与express一起工作，但直到现在都没有成功。
试图走两条路。
/admin
/admin/dashboard
创建了以下文件：
index.html
<!DOCTYPE html>
<html lang="pt-br" data-ng-app="testApp">
<head>
<base href="/admin">
</head>
<body ng-controller="AdminCtrl">
<div class="app" id="app" ui-view></div>
<script src="../bower_components/angular/angular.js"></script>
<script src="../bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="../admin/app.js"></script>
<script src="../admin/admin.controller.js"></script>
<script src="../admin/dashboard.controller.js"></script>
</body>
</html>
app.js
'use strict';
angular.module('testApp', ['ui.router'])
.config(function ($stateProvider, $urlRouterProvider, $locationProvider) {
$stateProvider
.state('admin', {
url: '/admin',
templateUrl: 'admin/admin.html',
controller: 'AdminCtrl'
})
.state('admin.dashboard', {
url: '/admin/dashboard/',
templateUrl: 'admin/dashboard.html',
controller: 'DashboardCtrl'
});
$locationProvider.html5Mode(true);
});
admin.controller.js
angular.module('testApp')
.controller('AdminCtrl', function() {
console.log("I'm AdminCtrl");
});
dashboard.controller.js
angular.module('testApp')
.controller('DashboardCtrl', function($scope) {
console.log("I'm DashboardCtrl");
});
dashboard.html
I'm the dashboard.html
admin.html
I'm the admin.html
尝试在浏览器上加载以下URL：
http://localhost:9000/admin/
http://localhost:9000/admin/dashboard
这两个URL有相同的结果：
- 控制台上没有错误
- 已加载所有文件(编号404)
- index.html显示正确
- 在控制台上，显示"我是AdminCtrl"(因此，AdminCtrl已加载)
- 浏览器只显示一个空白页面(admin.html和dashboard.html还没有加载？)
- 消息"我是DashboardCtrl"从未显示，那么我认为DashboardCtrl从未被调用
PS：routes.js(来自express)
app.route('/admin/*')
.get(function(req, res) {
res.sendfile(app.get('appPath') + '/admin/index.html');
});
我注意到你的面板url上有一个结束斜杠。我会尝试更正这一点，正如Sunil d.所说，当你在路由中定义Admin控制器时，你不需要指定它们。
其次，您可以尝试将仪表板的状态重命名为dashboard，以防止管理员和仪表板之间的父子关系。除非，也就是说，这就是你想要的。在这种情况下，admin.html页面也必须有一个ui-view。
首先确保"admin/admin.html"one_answers"admin/dashboard.html"是可访问的(只需复制borwser url框上的yourhost.com/admin/adminhtml的url并选中它)。
"我是DashboardCtrl"从未显示的原因是'admin.dashboard'状态上的url将仅为url: '/dashboard'
请在html模板中提及您的子控制器，如下所示
<div ng-controller="DashboardCtr">
也许这个链接能解决你的问题https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-嵌套视图和https://github.com/angular-ui/ui-router