Angularjs AngularUI嵌套路由问题 “/dashboard”正确路由到MainCtrl “/dashboard/exchange/1”正确路由到ExchangeCtrl “/dashboard/exchange/1/module/ae38596496d3”错误地路由到ExchangeCtrl

为什么第三个url没有路由到ExchangeModuleCtrl？如何修复此问题？

如果希望最后一个子状态：

'dashboard.exchange.module'

完全替换其父级

'dashboard.exchange'

，我们必须选择：

第一种选择，整个家长是一个目标 我们可以将

ui view=”“

放入父根

中。有。这将是

'dashboard.exchange'

状态模板视图/dashboard/exchange.html：

有关绝对命名的更多详细信息，请查看以下类似问答：

答案的原始部分 如果我们想遵循标准方法，就有

您的代码应该按原样工作

最重要的是，每个父级必须包含子级的目标：

ui view=“”

，例如：

.state('dashboard.exchange.module',{
    views : {
      '@dashboard' : {
        templateUrl:'views/dashboard/exchangeModule.html',
        controller: 'ExchangeModuleCtrl',
      },
    },
    url:'/module/{exchangeModuleHostName}',
})

视图

视图/dashboard/exchange.html

必须包含子状态的目标

'dashboard.exchange.module'

<div ui-view=""></div>

<div >
  <h2>dashboard</h2>      
  <br />      
  <div ui-view=""></div> // this is for child exchange      
</div>

dashboard.exchange


//这是用于子模块的

---

检查它

好的，因此我可能错误地使用了“儿童”概念。虽然我确实希望URL是一个层次结构，但dashboard.exchange.module将是一个完全不同的视图，而不是dashboard.exchange视图的扩展。dashboard.exchange在网格中列出exchange中的所有模块，当您单击其中一个模块时，它会显示所选模块的所有详细信息，但不会显示exchange或模块列表的详细信息。我更新了答案。现在有3个场景。它们应该涵盖您的所有需求，并展示如何使用UI路由器。选择哪一个取决于你自己。但我最初的答案是，考虑到继承会带来更多$作用域继承。也许可以查看此查看更多详细信息：谢谢！“跳过父项”选项2符合我的要求。

<div ui-view=""></div>

<div >
  <h2>dashboard</h2>      
  <br />      
  <div ui-view=""></div> // this is for child exchange      
</div>

<div >
  <h3>dashboard.exchange</h3>      
  <br />      
  <div ui-view=""></div> // this is for child module      
 </div>