angularjs - 如何禁用 Angular ui 路由器状态的数据继承

Question

如何禁止 Angular UI-router 中的子状态继承其父状态的数据？

例如，我的父子状态如下:

$stateProvider.state('parent', {
      data:{
         customData1:  "Hello",
      }
   })
   .state('parent.child', {
      data:{

      }
   });

这里子状态(parent.child)继承了其父状态的数据(customData1)。如何禁止它继承父级的数据？

Answer 1

虽然我不确定您为什么要这样做..您可以隐藏父实现:

Inherited Custom Data

Child states will inherit data properties from parent state(s), which they can overwrite.

$stateProvider.state('parent', {
      data:{
         customData1:  "Hello",
         customData2:  "World!"
      }
   })
   .state('parent.child', {
      data:{
         // customData1 inherited from 'parent'
         // but we'll overwrite customData2
         customData2:  "UI-Router!"
      }
   });

$rootScope.$on('$stateChangeStart', function(event, toState){ 
    var greeting = toState.data.customData1 + " " + toState.data.customData2;
    console.log(greeting);

    // Would print "Hello World!" when 'parent' is activated
    // Would print "Hello UI-Router!" when 'parent.child' is activated
})