有父状态默认子状态使用UI路由器

我有这样的状态结构：有父状态默认子状态使用UI路由器

.state('places', 
{ 
    url:'/places', 
    controller:'PlacesController', 
    templateUrl:'views/places.html' 
}) 
.state('places.city', 
{ 
    url:'/:city', 
    templateUrl:function(stateParams) 
    { 
     return 'views/places/'+stateParams.city+'.html'; 
    } 
});

它可以很好地除了当网址就是/places没有后一个城市。
如何在儿童状态下为templateUrl设置默认值？

我在想最好的方法是从PlacesController设置UI视图，但这似乎不可能。

来源

2013-12-15 Francisc

，你可以设置一个的jsfiddle？ –

对不起，没有语法高亮设置。应该是干净的现在阅读。 – Francisc

[angularjs ui-router default child state]可能重复（http://stackoverflow.com/questions/17001589/angularjs-ui-router-default-child-state） –

如角UI Wiki页面说：

有激活的状态三种主要方式：

调用$ state.go（）。高级便利方法。

单击包含ui-sref指令的链接。

导航到与状态关联的网址。

https://github.com/angular-ui/ui-router/wiki#activating-a-state

来源

2014-01-03 15:03:58 Francisc

不应接受此答案。它没有回答这个问题，这是关于在调用父状态时默认为子状态的问题。 – XML

+1为答案，我有同样的问题作为OP，它似乎从父母调用一个孩子是不正确的思想，只是访问子路径有相同的影响，没有涉及思维。 – HappyCoder

这不是通过它的孩子委托状态的解决方案！ –

尝试定义设置为空字符串的URL另一个子状态：

.state('places.default', { 
    url: '', 
    templateUrl: '...' 
}

然后加入abstract: true父状态。

来源

2013-12-15 22:26:51

嗯，这很聪明。如果有直接更改'ui-view'模板URL的方法，我会很高兴。 – Francisc

我不知道ui.router中有这样的函数。 –

谢谢，亚伦。 [extra chars] – Francisc

，而无需在您的状态配置中的任何改变，你可以直接把你的默认模板ui-view标签之间在你的HTML：

<!-- places.html --> 
<div ui-view> 
    <h1>Please choose a place</h1> 
</div> 

<!-- london.html --> 
<h1>London is amazing!</h1>

现在，当您导航到/places ，你会看到“请选择一个地方”的信息，当你导航到/places/london时，你会看到“伦敦太棒了！”。

来源

2014-05-11 15:07:55 Elise

繁荣！正是我需要的，谢谢！ –

由亚伦说，你可以使用$状态导航到一个默认的子状态，但这里有一个陷阱说假设你有超过1名儿童：

.state('places', 
    { 
     url:'/places', 
     controller:'PlacesController', 
     templateUrl:'views/places.html' 
    }) 
    .state('places.city', 
    { 
     url:'/:city', 
     templateUrl:function(stateParams) 
     { 
      return 'views/places/'+stateParams.city+'.html'; 
     } 
    }) 
    .state('places.child2', 
    { 
     url:'/:city2', 
     templateUrl:function(stateParams) 
     { 
      return 'views/places/'+stateParams.child2+'.html'; 
     } 
    });

和你父控制器PlacesController你有$ state.go（places.city）然后，只要父控制器即PlacesController被调用，你将被重定向到城市状态。所以如果有人在child2状态并按下刷新按钮，父控制器将被调用，他将被重定向到城市，这不是你想要的！

ANS：所以，你可以这样做，即如果该人是在父母的状态重定向之前检查当前的状态然后重定向到任何默认的子状态，但如果此人在任何孩子的状态，那么请不要做父控制器中的重定向： -

if($state.current.name == "places"){ 
    $state.go('places.city'); 
}

希望这有助于！父状态

.state('places', 
{ 
    url:'/places', 
    resolve: { default: function($state) { 
     if ($state.is('places')) $state.go('places.city', { url: 'london'}) 
    }} 
    controller:'PlacesController', 
    templateUrl:'views/places.html' 
}) 
.state('places.city', 
{ 
    url:'/:city', 
    templateUrl:function(stateParams) 
    { 
     return 'views/places/'+stateParams.city+'.html'; 
    } 
});

检查语法错误

来源

2014-09-08 11:11:39

作为注释，第二个代码块半身像在'PlacesController' –

使用的决心，我已经习惯了的CoffeeScript :)

来源

2015-05-18 11:22:43 goldylucks

有父状态默认子状态使用UI路由器

回答

相关问题