Require Authentication for Page

Question

I am new to angular2/ionic. What I'd like to do is only allow access to pages if they are authenticated. There will be some pages that don't require auth, but 95% need to be authenticated. I was hoping there was like a beforeNavigate property on the @Page decorator where I could run logic that would push the login page onto the nav stack if they weren't authenticated. Looking around, I can't seem to find anything like that. What would be the proper way of doing this without having to stick it in every constructor or something? Is there another way I could approach this? TIA.

Please note this is Angular2 / Ionic2 and typescript if that matters any.

you can do that with sates, please read this and research more about ui-router — macrog
So I actually already have this working in an older angular 1.x app, can this still be applied to angular2/ionic2? — jensengar
ups, sorry my bad, didn't realise it's version 2 you were asking about :/ — macrog

sebaferreras sebaferreras · Accepted Answer · 2016-06-09T19:27:56

You can find more information about View Lifecycle Hooks in Ionic 2 here

Ionic packages a set of view lifecycle hooks into the NavController. They follow four patterns of event handlers:

 1. onPageLoaded works the same way as ngOnInit
 2. onPageWillEnter and onPageDidEnter are hooks that are available before and after the page in question becomes active
 3. onPageWillLeave and onPageDidLeave are hooks that are available before and after the page leaves the viewport
 4. onPageWillUnload and onPageDidUnload are hooks that are available before and after the page is removed from the DOM

In your case, I think the one you are looking for is onPageWillEnter

============

EDIT:

On Ionic 2.0.0-beta.8 (2016-06-06), Ionic Lifecycle Events were renamed:

onPageLoaded renamed to ionViewLoaded
onPageWillEnter renamed to ionViewWillEnter
onPageDidEnter renamed to ionViewDidEnter
onPageWillLeave renamed to ionViewWillLeave
onPageDidLeave renamed to ionViewDidLeave
onPageWillUnload renamed to ionViewWillUnload
onPageDidUnload renamed to ionViewDidUnload

So the one you'd need to use is: ionViewWillEnter

Require Authentication for Page

1 Answers