History of navigating back with ng-include

I started developing a one-page web application with angularjs, and now I am defining navigation. So, I use 2 levels of navigation:

1st level: basic navigation using ng-view.

Level 2: SubView navigation with top and bottom columns using ng-include.

This is our iphone script:

App scenario

The iphone script looks fine to me because we control all the navigation with our buttons. But now let's think about an Android scenario where a user can use the back button (physical button) to go back. How can we support it if we use ng-include for a subset?

workflow using history back

Thank you in advance

+4
source share
1 answer

You can add a parameter to your URL so that it works with Android history.

#/main?page=1 #/main?page=2 

Then use , which , to control the state of your application, and then press the android button.

You can set URL parameters using $location.search :

 $location.search('page', 4); 

$ location.search docs: http://docs.angularjs.org/api/ng.$location#search

And one more thing: you need to add the reloadOnSearch: false parameter to your $routeProvider.when() declaration for your view. By default, the entire view is reloaded when the request parameter is changed using $location.search() . Setting this parameter to false will cause it to not reboot, which is what you need in this case:

 $routeProvider.when('/main', { reloadOnSearch: false }); 

reloadOnSearch docs: http://docs.angularjs.org/api/ng.$routeProvider#when

+2
source

All Articles