带ui-router的子状态未解析

Child state with ui-router not resolved

本文关键字：状态 ui-router      更新时间：2023-09-26

我仍然在做一个angular应用程序，使用伟大的ui-router。我想使用一些动态嵌套状态(我在这里讨论过)，所以我知道这是可能的。

下面是我的代码，带有一个特定的状态和它的动态子状态: 
    .state('home', {
       url: '/home',
       controller: 'RouteCtrl'
    })
    .state('home.state', {
       url: '/home/:state',
       controller: 'RouteCtrl'
     })
     $urlRouterProvider.otherwise('/home')

我有3个按钮(更具体地说，我使用<a>来制作)来访问3个不同的状态:"home"，"contact"answers"about"。'contact'和'about'是'home'嵌套状态，每个状态在激活时都有一个特定的文本要显示。

不幸的是，似乎两个子状态都没有从'home'状态解决。

这是一个与我的问题相匹配的问题的概要。你知道吗?

这将给你一个新的状态的工作调用:

$scope.redirect = function(state) {
    console.log('redirect to state : ' + state);
    if (state != 'home') {
      $state.go('home.state', {
        'state': state
      });
    } else {
      $state.go('home');
    }
  }

但是，它仍然不会改变页面上的文本，因为控制器在初始加载时只设置一次。

严格来说，home、contact和about不是3个状态。你所做的似乎是根据状态的参数来改变内容。当你使用$state.go

时，可以使用一个状态并强制ui-router重新加载该状态。

我在这里修改了你的plunkr http://plnkr.co/edit/XXaltjG17FwY15tSbKaD?p=preview

你的状态定义可以像这样，

.state('home', {      
  url: '/home?state',
  controller: 'RouteCtrl'
})

问号使状态参数可选，也是一个查询字符串。

重定向可以看起来像这样。你需要重新加载，因为你要去相同的路由

$state.go('home', {state: state}, {reload: true});

重定向到主页可能看起来像这样。您需要禁用此重定向的继承，因为您不想保留查询字符串。

$state.go('home',{}, {reload: true, inherit: false});

这里的主要问题是您希望在状态中有一个变量。你不能进入状态home.about，因为它不是给定的.state。

你应该看看stateParams，或者你可以用Angular的$location指定你想去的URL。

注意:我认为像home.state这样的子状态的url不需要/home url，因为它在父亲的状态

相关文章：