This is the Plunker link of the issue. I have configured 3 states : signup
, signin
& todos
. I have configured run
block too with $stateChangeStart
event attached, to ensure i redirect to signin
page if user is not logged in. In my project i use AuthencationService
for the validation but i have commented that part to simplify the example.
Ideally, if my understanding is correct, $stateChangeStart
will be called on every state change & it will be called when loading the application too. So no matter which state i hit i should be redirected to signin
state, as i do not have any AuthenticationService
checks here. I have written console.log
to check it & its getting called.
console.log('User is not signed in !! Sign-in please.');
When the application loads (here when you load the plunker), console.log
is getting printed
But the next statement $state.go('signin' , {}, {notify: false});
is not taking view to signin
page.
WTF ?
I have commented event.preventDefault();
despite of knowing its use. If i use it then nothing gets loaded, not even todos page !
Keep the notify, use event.preventDefault()
and watch out for infinite loop
https://plnkr.co/edit/pHLyUwCXBG4KwWdmI3l8?p=preview
Edit: To elaborate on the infinite loop. You set up simple condition to check if user is logged in. If not, you want to redirect him to signin
page. However, this check also fires for the signin
state, so you get infinite loop of redirects. Just add simple if
to check if currentState
is the signin
state, where you want to redirect.
event.preventDefault()
is the correct way to stop state transition, so leave that one uncommented.