重要$ stateParams Gotcha

Question

子状态DO从父状态继承以下内容：

通过解决方案解决了依赖关系

自定义数据属性

没有其他任何东西被继承（没有控制器，模板，网址等）。   但是，抽象状态的子节点确实继承了url属性   他们的父母作为他们自己网址的前缀。

这是否意味着在我的孩子状态下，我将能够解析整个请求字符串？

例如如果我有以下状态层次结构：

$stateProvider
  .state('contacts', {
    url: 'contacts/:contactId',
    abstract: true,
    /* ... */
  })
  .state('contacts.details', {
    url: '/details',
    controller: 'ContactDetailsController',
    /* ... */
  });

$stateParams中注入的ContactDetailsController是否可以访问要在contactId抽象状态中捕获的contacts？

Answer 1

在documentation中找到答案：

重要$ stateParams Gotcha

在状态控制器中，$stateParams对象将仅包含在该状态下注册的参数。所以你不会看到在其他州注册的params，包括祖先。

$stateProvider.state('contacts.detail', {
   url: '/contacts/:contactId',   
   controller: function($stateParams){
      $stateParams.contactId  //*** Exists! ***//
   }
}).state('contacts.detail.subitem', {
   url: '/item/:itemId', 
   controller: function($stateParams){
      $stateParams.contactId //*** Watch Out! DOESN'T EXIST!! ***//
      $stateParams.itemId //*** Exists! ***//  
   }
})

而是在父路由中使用resolve语句。

$stateProvider.state('contacts.detail', {
   url: '/contacts/:contactId',   
   controller: function($stateParams){
      $stateParams.contactId  //*** Exists! ***//
   },
   resolve:{
      contactId: ['$stateParams', function($stateParams){
          return $stateParams.contactId;
      }]
   }
}).state('contacts.detail.subitem', {
   url: '/item/:itemId', 
   controller: function($stateParams, contactId){
      contactId //*** Exists! ***//
      $stateParams.itemId //*** Exists! ***//  
   }
})

从ui-router的子状态访问参数

1 个答案:

重要$ stateParams Gotcha