angularjs：多個抽象狀態，重定向問題

Question

我想將兩個抽象狀態視圖合併成一個狀態。以下是我的代碼。問題是當我去.../#!/app/user/27/settings它重定向到.../#!/app/user/27不停留在用戶設置。

角版本1.6.4

App.js：

module.config(function ($stateProvider, $urlRouterProvider) 
{ 

    $urlRouterProvider.otherwise('/app/home'); 
    $stateProvider 

     .state("app", { 
      abstract: true, 
      url: "/app", 
      component: "appRouting" 
     }) 


     .state("app.user", { 
      url: "/user/:userId", 
      component: "userProfileRouting" 
     }) 

     .state("user", { 
      abstract: true, 
      url: "/user/:userId", 
      component: "userRouting" 
     }) 

     .state("app.user.settings", { 
      url: "/settings", 
      //component: "userSettingsRouting" 
      template: "hello" 
     }); 
} 

Answer 1

有趣的場景，這裏是解決方案：

正如你可以檢查Angularjs Nested states: 3 level嵌套是可能的。

問題出現在路由角度上，主要體現在如何使用ui-view來呈現路由。類似於this的問題。

關鍵的一點是，你的狀態app.user必須有一個ui-view包裝：

<div ui-view> 
    ...component code 
</div> 

請查看我以描述解決方案plnkr。

主要關注contact.detail.html內容。