如何检查摘要周期是否已稳定(又名“有角度完成编译?”)

时间:2014-02-26 10:58:35

标签: javascript angularjs angular-digest

tl; dr:最初的问题是“如何在每个摘要周期触发回调?”但潜在的问题更有趣,因为这回答了两个问题,我继续修改标题。 =)

上下文:在解析所有依赖项,ngincludes,API调用等之后,我正在尝试控制angular完成编译HTML(用于SEO预呈现原因)的时间。 到目前为止我发现的“最聪明”的方法是通过检查摘要周期是否已经稳定。
所以我想如果我每次触发摘要周期时都会运行一个回调并保持当前时间,如果没有其他在一个任意的失效(2000ms)内触发循环,我们可以认为编译已经稳定,并且页面已准备好为SEO爬虫存档。

到目前为止的进展:我认为观看$ rootScope。$$阶段可以做但是,虽然很多交互应该触发该观察者,我发现它只触发一次,在第一次加载

这是我的代码:

app.run(function ($rootScope) {
  var lastTimeout;
  var off = $rootScope.$watch('$$phase', function (newPhase) {
    if (newPhase) {
      if (lastTimeout) {
        clearTimeout(lastTimeout);
      }
      lastTimeout = setTimeout(function () {
        alert('Page stabilized!');
      }, 2000);
    }
  });



解决方案:添加了Mr_Mig的解决方案(荣誉)以及一些改进。

app.run(function ($rootScope) {
  var lastTimeout;
  var off = $rootScope.$watch(function () {
    if (lastTimeout) {
      clearTimeout(lastTimeout);
    }
    lastTimeout = setTimeout(function() {
      off(); // comment if you want to track every digest stabilization
      // custom logic
    }, 2000);
  });
});

1 个答案:

答案 0 :(得分:3)

我实际上不知道我的建议是否会回答你的问题,但你可以简单地将一个监听器传递给$watch函数,该函数将在每次迭代时被调用:

$rootScope.$watch(function(oldVal, newVal){
    // add some logic here which will be called on each digest cycle
});

看看这里:http://docs.angularjs.org/api/ng/type/$rootScope.Scope#$watch