CODEWITHSUNDEEP
javascriptangularjsangularangular-ui-router
Surjeet Bhadauriya
Surjeet Bhadauriya

Reputation: 7156

Can i have a dynamic parent in ncyBreadcrumb?

This is my index.route.js and I want my parent property to be dynamic like when the user clicks on it then it should display confirm prompt before changing state.

.state('user.edit', {
  url: '/{id}/edit',
  params: {
    id: {value: 'new'}
  },
  templateUrl: 'app/user.html',
  controller: 'EditUserController',
  controllerAs: 'vm',
  ncyBreadcrumb: {
    label: 'Add/Edit User',
    parent: 'user.list'  //(this one i want dynamic)
  }
})

Please help me.

Upvotes: 2

Views: 913

Answers (1)

Alon Eitan
Alon Eitan

Reputation: 12025

You need to listen the the $stateChangeStart event, and prevent it if the user choose to cancel it. In your controller:

vm.$on('$stateChangeStart', 
function(event, toState, toParams, fromState, fromParams, options){ 
    console.log(event, toState, toParams, fromState, fromParams, options); // Here you can see what parameters are passed to the event callback function
    if( !confirm('are you sure?') ) {
        event.preventDefault(); 
    }
});

BTW - vm is the $scope - not sure how you reference to it in your controller.

You can also bind it to the $rootScope inside the application's run() phase - This way you can detect state changes on a global level, and not just inside a specific sate. You will use the toState.name to know which state you're gooing and fromState.name to know the name of the sate you're leaving.

Upvotes: 1

Related Questions