Question

我正在创建一个图像库，如果在路径中指定了特定图像，则会加载特定图像（否则加载第一个图像）：

foo/photos/sports/2

每个缩略图都包含在一个链接中，以便更改地址（因此用户可以直接链接回来）：

<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>

问题是它会导致整个视图被重新渲染，而不仅仅是绑定到更改范围参数（scope.gallery.selected）的模板。

我找不到取消视图重新渲染的方法（但我仍然想要更新$ routeParams）。

我看过solutions听$locationChangeSuccess，但这对我的情况不起作用。

Answer 1

接近的一种方法是使用get参数，转到/ foo / photos / sports？page = {{$ index + 1}}并在该路由中（作为“when”的参数）设置reloadOnSearch：假。然后，您可以在不重新加载页面的情况下更新$ location.search（获取参数）并触发更改。

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

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

除此之外，我认为你不能使用默认的角度路由器。它总是重新加载路由更改上的所有控制器。然而，你可以切换到另一个路由器，如ui-router，我相信可以处理路径更改视图的重新加载部分。

Angularjs：更新位置而不触发路由

1 个答案: