I've got ngView with three ngIncluded views: search filters, products, pagination. I want to:

1. filter products without reloading whole page just products view
2. add filters to the url eg. ?category=shoes
3. be able to use back and next buttons

I set reloadOnSearch: false in $routeProvier.when. Now when I invoke $location.search() function url changes, but the page is not reloaded. That's what I wanted to achieve, but when I click back button the products does not reload to its previous state. The only thing which happens is a change of url. The question is how can I handle back and next button events in this situation?

I've got ngView with three ngIncluded views: search filters, products, pagination. I want to:

1. filter products without reloading whole page just products view
2. add filters to the url eg. ?category=shoes
3. be able to use back and next buttons

I set reloadOnSearch: false in $routeProvier.when. Now when I invoke $location.search() function url changes, but the page is not reloaded. That's what I wanted to achieve, but when I click back button the products does not reload to its previous state. The only thing which happens is a change of url. The question is how can I handle back and next button events in this situation?

• javascript
• jquery
• angularjs

2 Answers 2

If you do reloadOnSearch:false, the same instance of the controller is used and any back forward does not reload any controller or related view. You need to respond to $routeUpdate event that gets raised in such scenarios. See $route documentation regarding this.

$scope.$on('$routeUpdate',function(e) {
   // Code to handle the route change.
});

You have to handle everything manually. It means that when you press the back or the next button you have to get back to the state you where using the $location.