我有一个使用路由提供程序的简单 Angularjs 应用程序。主页呈现正常(包括部分),但其他路由上的部分未呈现(索引页面加载正常,但与 ngView 对应的部分为空白)。这是我所拥有的:
$APP_HOME/public/javascripts/app.js
angular.module('myapp', ['ngRoute', 'ui.bootstrap', 'myapp.services'])
.config([ '$routeProvider', function($routeProvider) {
$routeProvider.
when('/', {
templateUrl : 'partials/home.html',
controller : CarouselCtrl
}).
when('/add', {
templateUrl : 'partials/form.html',
controller : AddCtrl
}).
when('/about', {
templateUrl : 'partials/about.html',
controller : StaticCtrl
}).
when('/donate', {
templateUrl : 'partials/donate.html',
controller : PaymentCtrl
}).
otherwise({
redirectTo : '/'
});
} ]);
主页中的示例链接:
<li><a href="#/about">About</a></li>
partials 文件夹包含以下文件:
[root@localhost partials]# ls
about.html donate.html form.html home.html
我在 controllers.js 文件中有用于 StaticCtrl 和 PaymentCtrl 的空白控制器。
function StaticCtrl($scope){
}
function PaymentCtrl($scope){
}
所有相关的 js 文件也已包含在索引页面中。
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.js"></script>
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.0.js"></script>
<script src="/javascripts/app.js"></script>
<script src="/javascripts/services.js"></script>
<script src="/javascripts/controllers.js"></script>
文件夹结构:
我使用 node.js 作为网络服务器。
APP_HOME
[root@localhost]# ls
app.js node_modules package.json public README.md routes views
上市:
[root@localhost public]# ls
css images javascripts partials stylesheets
javascript:
[root@localhost javascripts]# ls
app.js controllers.js services.js
最初,我认为是导致问题的空白控制器,但它也不适用于非空控制器。不知道我错过了什么。请指教。