Question

有没有办法从父状态获取参数。

我的州看起来像这样。

    $stateProvider
        .state('home', {
            url: '/home/:param1',
            template: '<div>home<ui-view /></div>',
            data: {
            parentdata: 'parentdata'
                }
          })
        .state('home.child', {
            url: '/child/:param2',
            template: '<div>index</div>',
            data: {
            childdata: 'childdata'
                }
          })
})

我想从子状态访问父状态的数据值。

 $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {    
     var tosateParam = toState.data.mycustomparam;     
     //If this is the child state, how can I access the parent state param     
      //may be like this toState.parent.data.parentParam


   });

如果我当前的州名是"ABC.childstate"，我该如何从ABC州访问参数。

Answer 1

有a working plunker。让我们来看看这些状态

$stateProvider
    .state('home', {
        url: '/home/:param1',
        template: '<div>home<ui-view /></div>',
      })
    .state('home.child', {
        url: '/child/:param2',
        template: '<div>index</div>',
      })

这些链接：

<a href="#/home/first1/child/second1">
<a href="#/home/first2/child/second2">

然后这个：

$rootScope.$on('$stateChangeStart',
   function(event, toState  , toParams
                   , fromState, fromParams) 
    {
      console.log(toParams)
    });

会给我们这个：

Object {param1: "first1", param2: "second1"}
Object {param1: "first2", param2: "second2"}

检查here。也许这可能有点帮助Angular ui-router - how to access parameters in nested, named view, passed from the parent template?

Answer 2

如果我们需要访问父data {}，我们必须从UI-Router获得利润。参见：

What Do Child States Inherit From Parent States?

小引用：

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

通过解决方案解决了依赖关系
自定义 data {} 属性

没有 其他是继承的（没有控制器，模板，网址等）。

有了这个明确的文档消息，我们可以有像这样的状态（参见working example here）：

$stateProvider
    .state('home', {
        url: '/home/:param1',
        data: { parentdata: 'parentdata', },
        ...
      })
    .state('home.child', {
        url: '/child/:param2',
        data: {  childdata: 'childdata', },
        ...
      })

这些链接：

<a href="#/home/justAParent">
<a href="#/home/first1/child/second1">
<a href="#/home/first2/child/second2">

将作为文档说结果（对于像这样捕获的状态更改）

$rootScope.$on('$stateChangeStart',
   function(event, toState  , toParams, fromState, fromParams) 
    {
      console.log(toState.data)
    });

分为：

// href #/home/justAParent will show
Object {parentdata: "parentdata"}
// both #/home/first1/child/second1
//  and #/home/first2/child/second2 will show
Object {parentdata: "parentdata", childdata: "childdata"}

检查here

从stateChangeStart中的子状态访问父状态的参数

2 个答案:

What Do Child States Inherit From Parent States?