在每个页面中使用嵌套视图时，如何使用ui-router进行页面重定向？

Question

I am using ui-router and it works great with single page, as i have broken my page in multiple subviews each having its own controller. 我使用的是ui-router，它在单个页面上效果很好，因为我在多个子视图中破坏了页面，每个子视图都有自己的控制器。 Now i have two such pages, but not able to figure out how to redirect to another page using ui-router. 现在我有两个这样的页面，但是无法弄清楚如何使用ui-router重定向到另一个页面。

$stateProvider
 .state('main', {
  url: '/',
views: {
  '': {
    templateUrl: 'index.html',
    controller: 'projectInitCtrl',
  },
  'tab_overview': {
    templateUrl: 'assets/views/part_page.html',
    controller: 'tabOverviewCtrl',
  }
}
})
.state('dashboard', {
url: '/dashboard',
views: {
  '': {
    templateUrl: 'main.html',
    controller: 'projectInitCtrl',
  },
  'tab_overview': {
    templateUrl: 'assets/views/part_page_1.html',
    controller: 'tabOverviewCtrl',
  }
}
});

$urlRouterProvider.otherwise('/');

i can access / using localhost:9000(port on which i am running my app), now how to redirect to /dashboard? 我可以访问/使用localhost：9000（正在运行我的应用程序的端口），现在如何重定向到/ dashboard？

I am using angularjs. 我正在使用angularjs。 Do suggest me if alternative ways with which i can achieve this if not with ui-router? 如果没有ui-router，是否可以建议我其他方法？

Answer 1

It seems you want a simple two routes application with home and dashboard . 看来您想要一个带有home和dashboard的简单两路线应用程序。

Your code is correct, you simply need to simplify the corresponding html: 您的代码是正确的，您只需要简化相应的html：

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

Also, to avoid issues, I'd recommend not pointing your / route to index.html , since index.html should be your application home page, and reloading it in the ui-view is likely to cause odd behaviours. 另外，为避免出现问题，我建议不要将/路由指向index.html ，因为index.html应该是您的应用程序主页，并且在ui-view重新加载它可能会导致奇怪的行为。

With these two points going to home will show index.html (twice as per the point above), and going to dashboard will show main.html . 有了这两点，回到首页将显示index.html （按上面的点两次），转到仪表板将显示main.html 。

The point is the ui-view tag is where the view is shown when you go to /#dashboard. 关键是ui-view标记是您转到/＃dashboard时显示视图的位置。

Here is an updated plunker - note that plunkers url routing doesn't work ideally, so the links are required, but otherwise you could remove them. 这是一个更新的插件，请注意，插件URL路由在理想情况下无法正常运行，因此需要链接，否则您可以删除它们。

Also as it stands, your code seems to expect two views per url, which is why the original plunker had both ui-view="" and ui-view="tab_overview" , and showed two lines of info when you switched url. 同样，您的代码似乎希望每个URL有两个视图，这就是为什么原始的监听器同时具有ui-view=""和ui-view="tab_overview" ，并且在切换url时显示了两行信息。

在每个页面中使用嵌套视图时，如何使用ui-router进行页面重定向？

问题描述

1 个解决方案

解决方案1
2 已采纳 2016-05-08 04:52:30

在每个页面中使用嵌套视图时，如何使用ui-router进行页面重定向？

问题描述

1 个解决方案

解决方案1 2 已采纳 2016-05-08 04:52:30

解决方案1
2 已采纳 2016-05-08 04:52:30