History back navigation using ng-include

问题

I started to develop a single page web app with angularjs and now I'm defining the navigation. So, I end up using 2 levels of navigation:

1st level: Main navigation using ng-view.

2nd level: SubView navigation with the top and bottom bars using ng-include.

This is our iphone scenario:

The iphone scenario seems ok for me because we control all navigation with our buttons. But, now lets think in android scenario where the user can use the history back button(physical button) to navigate back. How can we support it if we use ng-include for the subnavigation?

Thanks in advance

回答1:

You could add a parameter to your URL to make it work with Android history.

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

Then use that to control the state of your app, and then android back button will work.

You can set url parameters with $location.search:

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

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

And one more thing: You'll want to add reloadOnSearch: false option to your $routeProvider.when() declaration for your view. By default, the whole view reloads when you change a query parameter with $location.search(). Setting that to false will make it not reload, which is what you want in this case:

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

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

来源：https://stackoverflow.com/questions/16280538/history-back-navigation-using-ng-include