【问题标题】：Accessing parameters from child states of ui-router从 ui-router 的子状态访问参数
【发布时间】：2016-05-14 19:50:04
【问题描述】：

在documentation中是这样说的：

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

通过resolve解决依赖关系

自定义数据属性

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

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

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

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

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

【问题讨论】：

你试过了吗？如果是这样，工作示例在哪里？
是的，如果您的网址以contacts/1/details 结尾，您可以使用ContactDetailsController 中的$stateParams 获取contactId
显然不是 :( 见github.com/angular-ui/ui-router/wiki/…

标签： javascript angularjs angular-ui-router

【解决方案1】：

在documentation找到答案：

重要的 $stateParams 陷阱

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

$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! ***//  
   }
})

相反，在父路由中使用解析语句。

$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! ***//  
   }
})

【讨论】：