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' 
     }) 
}); 

私のルーティングパスが/製品である場合には、その後、すべてがOKです。しかし、私のルーティングパスが/ product/addのときはエラーと思われます。しかし、 "/ product/add" を "/ add"に置き換えると、そのルートもOKです。だから私はルーティング "/ product/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

エラーページで正しくルートを設定してください。あなたはこのバイブルの例に従うことができます。よりhttps://jsfiddle.net/zahiruldu/jLdce3vj/186/

ため

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) { 
}); 

あなたは、ネストされたルート施設を進める与える適切にルーティングする親を処理するためのUIのルータを使用することができます。