Angular 正在路由到一个不存在的部分 html 文件。
我的文件夹结构是
|-- app.py (Python with Flask with basic routing into AngularJS) [Refer Code.01]
|-- static
|-- css (Has .css files)
|-- img (Has assets files)
|-- js
|-- app.js (Inits the routes and controllers) [Refer Code.04]
|-- lib (Has Angular and 3rd party .js files)
|-- partials
|-- about.html
|-- list.html (This page has place holder for ngGrid, with a cellTemplate that has link/route to Listdetail) [Refer Code.03]
|-- listdetail.html (This page has place holder for a form)
|-- templates
|-- 404.html
|-- index.html (Main page, with angular links and ng-view) [Refer Code.02]
列表正确显示，浏览器 url 为
http://myhost.com:5000/list.
在网格中单击“编辑”链接时，浏览器 url 变为
http://myhost.com:5000/list/CUSTOMER
正如它应该的那样，但 listdetail.html 没有呈现，我在控制台中看到以下内容
GET http://myhost.com:5000/list/static/partials/listdetail.html 404 (NOT FOUND)
为什么在应该使用“static/partials/listdetail.html”时寻找“list/static/partials/listdetail.html”？
[代码.01]
# routing for basic pages (pass routing onto the Angular app)
@app.route('/')
@app.route('/about')
@app.route('/blog')
def basic_pages(**kwargs):
return make_response(open('templates/index.html').read())
@app.route('/list')
@app.route('/list/<type_name>')
def show_list(type_name=None):
return make_response(open('templates/index.html').read())
[代码.02]
<script src="/static/lib/angular/1.2.10/angular.js"></script>
<script src="/static/lib/angular/1.2.10/angular-route.js"></script>
<script src="/static/lib/angular-ng-grid/ng-grid.js"></script>
<script src="/static/js/app.js"></script>
<script src="/static/js/controllers.js"></script>
<script src="/static/js/services.js"></script>
:
:
:
<div ng-controller="MainCntl as main">
<div id="header" class="header navbar navbar-static-top">
<div class="navbar-inner">
<div class="container">
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
</button>
<a class="brand" href="/List">List</a>
</div>
</div>
</div>
<div class="container">
<div id="content" class="container main" ng-view>
</div>
<hr>
<footer id="footer" class="footer">
<div class="footer-left">
<a href="/about">About</a> |
<a href="/">Home</a>
</div>
<div class="footer-right">
<span>© Footer</span>
</div>
</footer>
</div>
</div>
[代码.03]
$scope.listGridOptions = {
data: 'list',
multiSelect: false,
columnDefs: [
{field:'type', displayName:'Type'},
{field:'name', displayName:'Name'},
{field:'description', displayName:'Description'},
{field:'createdby', displayName:'Created By'},
{field:'editlayout', displayName: '', cellTemplate: '<div class="ngCellText"><a href="/list/{{row.entity.type}}">Edit</a></div>'}
]
};
[代码.04]
angular.module('ListManager', ['ngRoute', 'ngGrid'],
function($routeProvider, $locationProvider) {
$routeProvider.when('/', {
templateUrl: 'static/partials/landing.html',
controller: IndexController
});
$routeProvider.when('/about', {
templateUrl: 'static/partials/about.html',
controller: AboutController
});
$routeProvider.when('/list', {
templateUrl: 'static/partials/list.html',
controller: 'ListController'
});
$routeProvider.when('/list/:type_name', {
templateUrl: 'static/partials/listdetail.html',
controller: 'ListDetailController'
});
$locationProvider.html5Mode(true);
});