使用ngRoute的角度路由不適用於某些路由

Question

在我的單頁應用程序中，我使用ngRoute進行角度路由。但是我在角度路由方面遇到了一些問題。

配置：

app.config(function($routeProvider,$locationProvider){ 
    $locationProvider.html5Mode(true); 
    $locationProvider.hashPrefix('!'); 
    $routeProvider 
     .when('/product',{ 
      templateUrl : 'views/product/template/product.html', 
      controller : 'productCtrl' 
     }) 
     .when('/product/add',{ 
      templateUrl : 'views/product/template/add-product.html', 
      controller : 'productCtrl' 
     }) 
}); 

當我的路由路徑爲/產品，那麼一切正常。但是，當我的路由路徑是/產品/添加，那麼它似乎是一個錯誤。但如果「/ product/add」 替換爲「/ add」，那麼該路線也可以。所以我無法識別路由「/產品/添加」的主要問題。

錯誤：

http://localhost:3000/product/views/product/template/add-product.html 404 (Not Found) 

在這裏，我已經看到了問題。其他路由如下：

http://localhost:3000/views/product/template/product.html 

但是錯誤路由在服務器連接之後有/ product。

需要一些解釋&解決這個問題。

在此先感謝

Answer 1

錯誤頁面正確配置路由。你可以按照這個小提琴的例子。

HTML

<div ng-controller="MainCtrl"> 
    <ul> 
    <li><a href="/product">product</a></li> 
    <li><a href="/product/add">add</a></li> 
    <li><a href="/other">Other</a></li> 
    </ul> 
    <ng-view></ng-view> 
</div> 

角

var app = angular.module("myApp", []); 

app.config(function ($routeProvider,$locationProvider) { 
     $locationProvider.html5Mode(true); 
    $locationProvider.hashPrefix('!'); 
    $routeProvider 
    .when('/product', { template: 'I am product root' }) 
    .when('/product/add', { template: 'Adding a product' }) 
    .when('/other', { template: 'Other pages' }) 
    .otherwise({ redirectTo: '/product' }); 
}); 

app.controller('MainCtrl', function ($scope) { 
}); 

更多https://jsfiddle.net/zahiruldu/jLdce3vj/186/

您可以使用UI路由器處理父路由正確，會給你提前嵌套路線設施。