每个路由的角度ui路由器多个视图

在我的应用程序中，我有主要内容区域和屏幕外导航。主屏幕视图通过ui-view指令以角度填充。我希望我的离屏导航也通过ui-view指令填充。我不希望这是一个嵌套的视图，我希望这个视图显示独立于根视图但基于相同路线的内容。事情是这样的：每个路由的角度ui路由器多个视图

<body> 
    <ui-view="root"></ui-view> <!-- Main page view is here --> 
    <div id="OffscreenMenu"> 
     <ui-view="menu"></ui-view> <!-- This content will change each time the url changes --> 
    </div> 
</body>

所以后来我想是不定义多个状态，但有这将显示两个不同的模板，每个视图一个状态。

我找不到任何可能的方式。我有搜索文档，但我能找到的是关于嵌套视图的信息。提前致谢。

来源

2015-05-05 richbai90

你可以做到以下几点：

$stateProvider.state('state', { 
    views: { 
     '[email protected]': { /* controller, templateUrl */ }, 
     '[email protected]': { /* controller, templateUrl */ } 
    } 
});

您还可以使用parent属性：

$stateProvider 
    .state('topState', { 
     views: { 
      '[email protected]': { /* controller, templateUrl */ } 
     } 
    }) 
    .state('state1', { 
     parent: 'topState', 
     views: { 
      '[email protected]': { /* controller, templateUrl */ } 
     } 
    }) 
    .state('state2', { 
     parent: 'topState', 
     views: { 
      '[email protected]': { /* controller, templateUrl */ } 
     } 
    });

来源

2015-05-05 15:47:57

我将它设置成有两个子视图的绝对根视图。

.state('app', { 
    abstract: true, 
    url: '/', 
    ... 
}) 
.state('app.root', { 
    ... 
}) 
.state('app.menu', { 
    ... 
})

来源

2015-05-05 15:49:10 joshvito

每个路由的角度ui路由器多个视图

回答

相关问题