Question

我目前正试图弄清楚如何更改路线参数而不重新加载整个页面。例如，如果我从

开始

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而无需重新加载或重置页面？

Answer 1

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

我发现在角度文档上发现任何内容都是非常不可能的，但有时候，一旦找到它，就会改变你对问题的看法。

我从这里开始：http://docs.angularjs.org/api/ng。$ location 我带我到这里：http://docs.angularjs.org/guide/dev_guide.services。$ location 这让我想到了这个问题：AngularJS Paging with $location.path but no ngView reload

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

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

我希望这可以让别人头疼。

Answer 2

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

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

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

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

Answer 3

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

我建议使用角度ui-router，它非常适合在不重新加载页面的情况下切换状态。唯一的缺点是你必须改变你所有的路线。

Check it out here这是一个很棒的演示。

更改路由参数而不更新视图

3 个答案: