Documentation for $transitions

[MileanCo]

There is hardly any documentation for the $transitions service [or at least I can't find it]; I'm not sure exactly how to use it properly. This is what i want to do:

angular.module("app.core").run(function ($rootScope, $state, $transitions ) {
     $transitions.onSuccess({to:'*'}, function ($state) {
        // do stuff on every transition such as change page title [global scope here]
     }
}

The wiki in https://github.com/angular-ui/ui-router/wiki is outdated; it uses the old 'OnStateChange' services. These breaking changes came from this https://github.com/angular-ui/ui-router/issues/2219

[christopherthielen]

agreed, the alpha docs are difficult to find at the moment.

--http://angular-ui.github.io/ui-router/1.0.0-alpha.3/interfaces/transition.ihookregistry.html--

Edit: Docs have a new home! http://ui-router.github.io/docs/latest

Read about the Transition Service ($transitions): https://ui-router.github.io/docs/latest/classes/transition.transitionservice.html

[briananderson1222]

Even just expanding upon the intent of this service. The $stateChange events were deprecated and I assume this service was meant as a 'replacement' for that functionality.

I wrote a question on stackoverflow asking about how to obtain parity between these in the context of Angular 1.

http://stackoverflow.com/questions/39169207/ui-router-v1-0-transitions-service-in-angular-1-x

But without more detailed documentation it's hard for me to understand if this is really meant as a full replacement or even what exactly is defined as a 'transition' let alone the syntax allowed for the HookMatchCriteria. Is the syntax used in @MileanCo example above valid? Should that match all top level routes or all routes? I would love to gain that clarity on the desired functionality before opening an issue in the repo for the stackoverflow question mentioned above. Thanks for all the hard work @christopherthielen

[christopherthielen]

Even just expanding upon the intent of this service.

The $stateChange* hooks were all globally scoped events and did not support any asynchronous behaviors like checking the server for content or lazy loading code. The 1.0 Transition Hooks (via the Transition Service) addresses those shortcomings.

But without more detailed documentation it's hard for me to understand if this is really meant as a full replacement

They are meant as a full replacement for the state change Events.

or even what exactly is defined as a 'transition'

A Transition is the process of changing from one state+params (the from state) to another (the to state).

the syntax allowed for the HookMatchCriteria

See here for the gory details

[briananderson1222]

@christopherthielen Thanks for the detailed answer and for answering that SO question 👍 Definitely did not know about the visualizer.. such an awesome tool!

[timobehrens]

@christopherthielen Concluding from the fact that the $transitions.on* should replace the $stateChangeStart events, how can we access the next state's parameters in the same manner as how we used to do it via (event, nextState, nextStateParams, ...) inside the run block with $transitions? I can't find a way of getting the parameters of the next state inside the run block. I have exactly the same problem as depicted here: [http://stackoverflow.com/questions/40242765/ui-router-how-to-get-next-state-params-in-transition]. Could you help me by answering the question on SO?. Thanks and keep it up the good work!

[christopherthielen]

@timobehrens I answered the SOF question

[timobehrens]

@christopherthielen Thank you sir! Works like a charm.

[christopherthielen]

Documentation is available at https://ui-router.github.io/docs/latest/

[borislemke]

@christopherthielen 404

[christopherthielen]

Thanks, I have added a redirect.

[roypeled]

I can't seem to find anywhere a description on how to access the transitions from state params. To get the next state params is simple:

$transitions.onExit({}, (transition:Transition)=>{
       let nextParams = transition.params();
});

How would I get the state params of the state that I am leaving?

[christopherthielen]

@roypeled

transition.params(”from”)