AngularJS $location replace() 也替换了最后一个历史条目答案

【问题标题】：AngularJS $location replace() replacing last history entry alsoAngularJS $location replace() 也替换了最后一个历史条目
【发布时间】：2015-03-11 08:08:03
【问题描述】：

在我的 AngularJS 应用程序中，我只需要在浏览器历史记录中保存状态更改。这就是为什么当我更改 $location 的参数时，我使用的是 replace() 方法。

例如，当我访问 /page1 时，它会保存在历史记录中。 'centre' 参数是用 replace() 自动添加的，因此它不会添加新的历史条目：

$location.search('centre', hash).replace();

每次我移动地图时，“中心”都会改变。

当我转到 /page2 时，会创建历史记录中的新条目。当我移动地图时，“中心”会发生变化。

问题是，当我按下 BACK 按钮时，我将转到 /page1，但我需要保持“中心”与以前相同，但它会更改为与 /page1 的历史条目一起保存的内容。

我该如何解决这个问题？

我尝试添加：

$window.history.replaceState({}, '', $location.absUrl());

我做了replace()之后，但是没有用。

【问题讨论】：

标签： angularjs html5-history

【解决方案1】：

这就是我解决这个问题的方法。

首先，我们需要将搜索结果保存为上一个和当前：

$rootScope.$on('$locationChangeStart', function (event, toURL, fromURL) {
    if ($rootScope.search.current) {
        $rootScope.search.previous = $rootScope.search.current;
    }

    $rootScope.search.current = $location.search();
});

那么我们需要始终改变我们目前所处的实际位置。

$rootScope.$on('$locationChangeSuccess', function (event, toURL, fromURL) {
    $rootScope.actualLocation = $location.path();
});

如果按下后退按钮，则必须在 URL 中更改中心（使用以前的搜索结果），而无需推送新的历史条目。

$rootScope.$watch(function () { return $location.path() }, function (newLocation, oldLocation) {
    if ($rootScope.actualLocation === newLocation) {
        $location.search('center', $rootScope.search.previous.center).replace();
    }
});

【讨论】：

【解决方案2】：

我发现在 0 毫秒超时内调用搜索和替换可确保它发生在与主状态更改不同的摘要周期中，并防止先前的状态被替换。

类似：

$timeout(function() {
    $location.search('centre', hash).replace();
}, 0);

【讨论】：

除非在角度摘要之外调用，否则不需要摘要调用，replace 方法设置一个标志以在当前摘要周期内替换角度内部的历史记录，并在摘要完成后更新为 false。

【解决方案3】：

我遇到了同样的问题，只能通过使用本机历史 API 来使其正常工作，如下所示：

window.history.replaceState(hash, null, $location.absUrl());

【讨论】：

摘要循环将加载页面