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

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

如果我们需要访问父级数据{}，我们必须...从UI-Router获利。见:

What Do Child States Inherit From Parent States?

小引用:

Child states DO inherit the following from parent states:

• 通过 resolve 解决依赖
• 自定义数据{}属性

Nothing else is inherited (no controllers, templates, url, etc).

有了这个清晰的文档消息，我们就可以有这样的状态(参见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