我问这个问题的一个类似的问题：
UI Router conditional ui views?,但我的情况有点复杂,我似乎无法得到所提供的答案.
基本上,我有一个url可以渲染两种非常不同的方式,这取决于url指向的实体类型.
这是我正在尝试的
$stateProvider
.state('home',{
url : '/{id}',resolve: {
entity: function($stateParams,RestService) {
return RestService.getEntity($stateParams.id);
}
},template: 'Home Template <ui-view></ui-view>',onEnter: function($state,entity) {
if (entity.Type == 'first') {
$state.transitionTo('home.first');
} else {
$state.transitionTo('home.second');
}
}
})
.state('home.first',{
url: '',templateUrl: 'first.html',controller: 'FirstController'
})
.state('home.second',templateUrl: 'second.html',controller: 'SecondController'
});
我设置了一个解决方案,从一个安静的服务中获取实际的实体.
每个事情似乎都在工作,直到我实际到达到基于类型的转换.
转换似乎有效,除了解决方案重新启动,getEntity失败,因为id为null.
我试图将id发送到transitionTo调用,但是它仍然尝试做一个第二个解决方案,这意味着实体从其余服务中获取两次.
似乎发生的是在onEnter处理程序中,状态实际上还没有改变,所以当转换发生时,它认为它正在转换到一个全新的状态而不是一个子状态.这进一步被证明是因为我删除实体.从transitionTo的状态名称,它认为当前状态是root,而不是home.这也阻止我使用’go’而不是transitionTo.
有任何想法吗？
templateUrl也可以是一个功能,因此您可以检查类型并返回不同的视图,并在视图中定义控制器,而不是状态配置的一部分.您不能将参数注入到templateUrl中,因此您可能必须使用templateProvider.
原文链接：https://www.f2er.com/angularjs/140455.html$stateProvider.state('home',{
templateProvider: ['$stateParams','restService',function ($stateParams,restService) {
restService.getEntity($stateParams.id).then(function(entity) {
if (entity.Type == 'first') {
return '<div ng-include="first.html"></div>;
} else {
return '<div ng-include="second.html"></div>';
}
});
}]
})
