Calling transitionTo in state's onEnter function

[Ryaan]

$state.transitionTo doesn't appear to have any effect when called in the onEnter function when configuring states, neither does it appear to have any effect when called after a $stateChangeStart

Plunker example - http://plnkr.co/edit/02DgxY383LDnxwn4lqbE?p=preview

Stackoverflow post - http://plnkr.co/edit/02DgxY383LDnxwn4lqbE?p=preview

[Ryaan]

    if ($state.transition !== transition) return TransitionSuperseded;

does not seem to be working and I have no idea why.

[danielgatis]

I have the same problem when the user is not allowed to go to the state so I need to redirect to 403 state.
The $state.go inside onEnter callback doesnt work.

"use strict"

@App.config ($stateProvider) ->

  $stateProvider
    .state "tasks/edit",
      url: "^/tasks/{id:[0-9]+}/edit"
      controller: "EditTaskCtrl"
      templateUrl: "angularjs/app/tasks/edit/edit"
      resolve:
        task: ($stateParams, Task) -> Task.get $stateParams.id
      onEnter: ($state, task) ->
        if not task.permissions.canUpdate
          $state.go '403', null,
            location: false

But the same code inside a $timeout works.

"use strict"

@App.config ($stateProvider) ->

  $stateProvider.state "tasks/edit",
    url: "^/tasks/{id:[0-9]+}/edit"
    controller: "EditTaskCtrl"
    templateUrl: "angularjs/app/tasks/edit/edit"
    resolve:
      task: ($stateParams, Task) -> Task.get $stateParams.id
    onEnter: ($timeout, $state, task) ->
      if not task.permissions.canUpdate
        $timeout ->
          $state.go '403', null,
            location: false
        , 0

[timkindberg]

Hell yeah @nateabele 👍

[jpodpro]

can someone explain how this is supposed to work? using $state.go to a child state in the onEnter of the parent state i get a circular loop as the parent onEnter is always fired. according to @nateabele (http://stackoverflow.com/questions/19429652/ui-router-conditional-ui-views) this is how it is supposed to be done.

$stateProvider
        .state( 'homePage', {
            url: '/',
            onEnter: ['userService', '$state', function( userService, $state, title )
            {
                $state.go( 'homePage.guest' );
            }]
        })
        .state( 'homePage.user', {
            templateUrl: 'app/homePage/homePage.user.html',
            controller: 'HomeControllerUser',
            controllerAs: 'hcu'
        })
        .state( 'homePage.guest', {
            templateUrl: 'app/homePage/homePage.guest.html',
            controller: 'HomeControllerGuest',
            controllerAs: 'hcg'
        });

[nateabele]

@jpodpro I don't recall what my final suggestion was for the initial issue, but in 1.0 you can handle this simply by injecting $transition$ into your callbacks.

[jpodpro]

@nateabele i just updated to 1.0 only to discover there are virtually no examples for how to use the new system. your sample app: http://christopherthielen.github.io/new-state-vis gets a 404. i'm reading the documentation carefully but without examples it's not easy to understand how to migrate from events to hooks.

[nateabele]

I gave a talk with some examples: http://radify.io/talks/2015-sep-ngpittsburgh/

[christopherthielen]

I am in process of moving the example app to its new home. Sorry about that.

https://github.com/ui-router/sample-app

[skeymeulen]

@jpodpro Were you able to resolve this problem? I'm having exactly the same issue.
I tried using $transition$, but previous() is always undefined.

[nateabele]

@skeymeulen It should never be undefined. See here:

ui-router/src/transition/transition.ts

Line 214 in 3d3c50f

previous(): Transition {

To take advantage of that, you need to be using redirect() in your hooks though, not $state.go().

[christopherthielen]

To take advantage of that, you need to be using redirect()

Return a TargetState from a hook, in order to redirect. Use the $state.target() factory method. (the docs currently incorrectly say .targetState())

[skeymeulen]

Thanks guys, $state.target was the was they key element for me. I was able to resolve the problem by returning $state.target() in $transitionsProvider. This eliminated the problem of the circular loop entirely. Didn't even need to use $transition$.