UI 路由器嵌套视图问题

Question

我再次为 ui 路由器苦苦挣扎。

我正在尝试一些嵌套视图。

导航到 url/account/management/Company（由 Symfony 管理的路由）时调用主布局 home.html。然后我想让 ui 路由器启动。

看起来像这样：

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

那么这是我的js路由定义：

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

    $urlRouterProvider.otherwise("");

    $stateProvider
      .state('flatView', {
          url:"",
          views: {
              'main': {
                  controller:"flatViewHome",
                  templateUrl:Routing.generate('_NRtworks_FlatView_elementList') 
              },
              'discrimSelector@flatView': {
                  templateUrl:Routing.generate('_NRtworks_FlatView_DiscrimSelector')                 
              }
          }
      });

});

我已经按照建议为第二个视图使用全名，但它没有加载（"main" 模板加载得很好，我可以在网络选项卡中看到另一个文件的文件模板实际上已获取但未插入 ui-视图）。

我做错了什么？

Answer 1

从 discrimSelector@flatView 中删除 @flatView。

表示法是uiview@state。仅当您想加载另一个状态的 ui-view 时才应使用它。

例如假设您有两个嵌套状态。当您处于子状态时，您想要加载父级（任何祖先）的 ui-view，那么您将使用此表示法。

 $stateProvider
  .state('parent', {
      views: {
          'A': {
              ...              
           },
          'B': {
              ...           
          }
      }
  })

 .state('child', {
       views: {
          'C': {
              ...              
           },
          'A@parent': {
              ...           
          }
      }
  });

UI 路由器嵌套视图问题

UI router nested views issue

angular-ui-router