10

我目前正在处理一些带有延迟加载内容+控制器的代码。我的代码基本上像这个 fiddle一样工作。但是,由于某种原因,我的版本不起作用,而是每当 angular 尝试更新它的视图时,我都会得到一个无限的摘要循环。

当我ng-include从这个简单的重复语句中删除时,问题就消失了:

<div class="container" ng-repeat="pageName in pageNames">
  <div ng-include="pageName"></div>
</div>

最奇怪的部分:exact same error即使pageNames从未分配给范围,也会发生。两个范围(外部和内部控制器的范围 - 我都有一个)可以完全为空(我检查了 Batarang - 我只有两个空范围),我仍然得到错误。

我的代码有点太复杂了,有太多其他依赖项,所以在这里发布它是没有意义的。它最纯粹的版本是上面的小提琴。我找不到两者之间的逻辑差异。当我用 Batarang 检查我的示波器时,我也没有发现任何可疑之处:

  • 我没有在我的范围内使用函数
  • 我没有利用$watch
  • 我没有利用ng-model

我的结论是我没有明确地改变任何东西,所以它一定是有角的。

我能否以某种方式让 Angular 或 Batarang 告诉我在摘要迭代后哪些范围变量发生了变化,以便我可以确定导致无限循环的罪魁祸首?

更新:

我终于想通了,history.pushState一切都搞砸了。我现在正在寻找替代方案,例如$location服务。尽管如此,我仍然想知道如何调试这类问题。有什么提示吗?

4

1 回答 1

13

没有直接的方法来获取在每个摘要中更改的范围变量列表,但是如果您处于紧急调试情况,修改 Angular 的源代码以(临时)执行此操作非常简单。$digest 代码在这里:

angular.js > src > ng > rootScope.js

如果您查看此方法,您将看到对 watchLog 数组的引用。AngularJS 使用它来报告有用的错误消息,当它检测到你正在得到的循环时。您可以在此处轻松添加一些 console.log 项目,或者维护您自己的数组,以便稍后记录或使用调试器进行检查。您还可以在此处设置断点以查看发生了什么。

我不清楚为什么 history.pushState() 会与此有关,因为您最初的问题没有谈到 $location、history 或相关函数的使用。但是,请注意,当路径不是您期望的那样时,使用 ngInclude 创建无限循环是一个非常常见的问题。大量服务器端(例如 NodeJS)项目被配置为在找不到资源时返回主页/索引页面,因为它们假设正在进行前端路由。这实际上是一个大问题,因为您最终将主页嵌入到主页中,然后再嵌入另一个副本,等等。我在 S/O 上看到这种问题大约每周发布一次。

对此的一个简单测试是更改您的服务器以针对未找到的任何资源返回一个空的 404。每当有人提到“无限循环”和任何类型的资产加载操作时,我总是推荐这个:ui-router、ngRoute、ngInclude 等。

这在路径中使用相对 URL 时尤其常见。

于 2014-10-04T15:09:22.133 回答