Refreshing cached pages once logged in

I have two pages that are restricted to logged in users. If a non-logged in user attempts to visit these pages they are greeted with a login page.

This check is performed using ng-if conditions.

<div ng-if="userIsLoggedIn"> // display page </div>
<div ng-if="!userIsLoggedIn"> <ng-include src="loginPage.html"> </div> 

When a user successfully logs in I am using this command:

$state.go($state.$current, null, { reload: true });

This will reload the page and now show the content for the logged in user.

My problem is: When a logged in user navigates to the other page they are presented with a login page! Both pages are using the same LoginController. It would seem it has cached the page from when the user was logged out. If I press F5 on the browser then the page refreshes and shows the user as logged in.

Is there either a quick fix to this. Or is there a better approach for handling login restricted pages?

Many thanks


I was not setting the userIsLoggedIn variable in the scope of page2controller.