How to disable inheritance of state data wwwwwwwwwwwwu

How do I disable child state in angular UI-router

from inheriting its parent state data?

For example, I have a parent and child state like this:

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

      }
   });

      

Here child state ( parent.child

) inherits data ( customData1

) from its parent. How can I disable it from inheriting parent data?

+3


source to share


1 answer


While I'm not sure why you need this ... you can hide the parent implementation:

Inherited user data



Child states will inherit data properties from the 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
})

      

0


source







All Articles