0

I'm creating an image gallery that loads a specific image if it is specified in the route (else loads the first):

foo/photos/sports/2

Each thumbnail is wrapped in a link to cause the address to change (so users can link back to it directly):

<ul class="gallery-thumbnails">
  <li ng-repeat="piece in gallery.pieces">
    <a ng-href="/foo/photos/sports/{{$index+1}}">
      <img ng-src="{{piece.img}}" />
    </a>
  </li>
</ul>

The problem is that it causes the whole view to be re-rendered instead of just the template binded to the changed scope param (scope.gallery.selected).

I can't find a way to cancel the view re-render (but I still want $routeParams to be updated).

I've seen solutions that listen for $locationChangeSuccess, but that doesn't work for my scenario.

Community
  • 1
  • 1
Jakob Jingleheimer
  • 30,952
  • 27
  • 76
  • 126
  • possible duplicate of [Change route parameters without updating view](http://stackoverflow.com/questions/17981281/change-route-parameters-without-updating-view) – Stewie Dec 02 '13 at 08:25
  • @stewie, Query params are not appropriate for what I'm doing (I'm creating a URI, not filtering results). I ended up having to switch to ui.router. – Jakob Jingleheimer Dec 07 '13 at 07:34

1 Answers1

4

One way to get close is to use get parameters instead, going to /foo/photos/sports?page={{$index+1}} and in that route (as an argument to "when") set reloadOnSearch: false. You can then update the $location.search (the get parameters) without the page reloading and trigger things on the changes.

  // Using reloadOnSearch
  .when('/foo/photos/sports', {
    templateUrl: 'sports',
    reloadOnSearch: false
  });

  // Changing the get parameters (search part of url)
  $location.search({'page': 1});

Apart from that I don't think you can do it with the default angular router. It always reloads all controllers on a routechange. You could however switch to another router such as ui-router which I believe can handle reloading parts of a view on path-change.

Erik Honn
  • 7,576
  • 5
  • 33
  • 42