20

我目前正在尝试弄清楚如何在不重新加载整个页面的情况下更改路由参数。例如，如果我从

http://www.example.com/#/page

但将名称更新为“George”，将路线更改为：

http://www.example.com/#/page/george

如果我已经有http://www.example.com/#/page/:name路由。

无需重新加载位置。可以只设置 $routeParams.name = "George" 吗？

编辑： 或者，有没有办法在不重新加载或重置页面的情况下更新http://www.example.com/#/page?name=George ？

4

3 回答 3

42

好的，经过大量搜索。我回答了我自己的问题。

我发现在 Angular 文档中找到任何东西是难以置信的，但有时，一旦找到它，它就会改变你对问题的思考方式。

我从这里开始：http://docs.angularjs.org/api/ng .$location 把我带到了这里：http://docs.angularjs.org/guide/dev_guide.services .$location 这把我带到了这个问题：AngularJS 分页与 $location.path 但没有 ngView 重新加载

我最终做了什么：我添加$location.search({name: 'George'});到我想更改名称的地方（A $scope.$watch）。

但是，这仍然会重新加载页面，除非您执行底部 StackOverflow 链接中的操作并将参数添加到您传入的对象中$routeProvider.when。就我而言，它看起来像：$routeProvider.when('/page', {controller: 'MyCtrl', templateUrl:'path/to/template', reloadOnSearch:false}).

我希望这可以避免其他人头疼。

于 2013-08-01T15:37:56.183 回答
12

实际上，我找到了一个对我的应用程序来说更优雅的解决方案。

$locationChangeSuccess 事件是一种蛮力的做法，但我发现检查路径可以避免在路由路径模板未更改时重新加载页面，但在切换到不同的路由模板时重新加载页面：

var lastRoute = $route.current;
$scope.$on('$locationChangeSuccess', function (event) {
    if (lastRoute.$$route.originalPath === $route.current.$$route.originalPath) {
        $route.current = lastRoute;
    }
});

将该代码添加到特定控制器使重新加载更加智能。

于 2014-03-24T15:55:46.997 回答
-6

您可以使用 ng-show 和 ng-hide 更改页面的显示，这些转换不会重新加载页面。但我认为您要解决的问题是您希望能够为页面添加书签，能够按刷新并获得您想要的页面。

我建议实现 angular ui-router，它非常适合在不重新加载页面的情况下切换状态。唯一的缺点是您必须更改所有路线。

看看这里有一个很棒的演示。

于 2013-07-31T22:05:58.807 回答