在角度应用程序中使用 pushState() 更改浏览器 url 时出现错误答案

【问题标题】：i have an error when change browser url with pushState() in angular application在角度应用程序中使用 pushState() 更改浏览器 url 时出现错误
【发布时间】：2014-10-21 18:24:23
【问题描述】：

在angularJs应用程序中打开bootstrap modal时我需要更改浏览器URL，我使用pushState()函数，URL已经改变，但它会抛出以下错误：

Uncaught Error: [$rootScope: infdig] 10 $digest() iterations reached.Aborting!
    Watchers fired in the last 5 iterations: [
        ["fn: $locationWatch; newVal: 8; oldVal: 7"],
        ["fn: $locationWatch; newVal: 9; oldVal: 8"],
        ["fn: $locationWatch; newVal: 10; oldVal: 9"],
        ["fn: $locationWatch; newVal: 11; oldVal: 10"],
        ["fn: $locationWatch; newVal: 12; oldVal: 11"]
    ] 
    http: //errors.angularjs.org/1.2.13/$rootScope/infdig?p0=10&p1=%5B%5B%22fn%3…2fn%3A%20%24locationWatch%3B%20newVal%3A%2012%3B%20oldVal%3A%2011%22%5D%5D angular-1.2.13.js:78
    (anonymous function) angular-1.2.13.js:78
    Scope.$digest angular-1.2.13.js:11937
    (anonymous function) angular-1.2.13.js:12084
    completeOutstandingRequest angular-1.2.13.js:4144
    (anonymous function)

【问题讨论】：

请澄清您的问题。添加引发错误的代码。

标签： angularjs pushstate

【解决方案1】：

这是 Angular 中 $location 服务的一个错误。它刚刚在 2014 年 8 月 27 日的最新版本 Angular 1.3.0-beta.20 中修复。请参阅问题 3924 和重复的 6976，这是修复的功劳。

angular-ui 团队制作了临时修复的文档：https://github.com/angular-ui/ui-router/issues/562#issuecomment-31623003

这个问题是因为 Angular 没有同步通知浏览器 url 的变化，并且信任它在 $browser.url() 中缓存的 url 版本。由于 $browser.url() 作为 getter 是幂等的，因此它会不断返回真实的 url，而不会更新其 url 的内部记录。

要验证这是真的，请在提供的测试中添加这一行，就在 window.history.replaceState 行之后，测试将通过：angular.element($window).triggerHandler('popstate');

通过在 url getter 中重置 lastBrowserUrl，可以通过 $browser 中的一行轻松解决此问题： lastBrowserUrl = newLocation || location.href.replace(/%27/g,"'");但这可能会导致不必要的副作用。

【讨论】：