为何Angular在这里不随范围更新？

Question

我对Angular很陌生，并且使用firebase作为后端。我希望有人可以调试此问题。当我第一次进入我的页面
**www.mywebsite.com/#defaultHash时** ，数据不会加载到DOM中，但在访问另一个哈希链接并返回之后，它确实会加载。

我的控制器是这样的：

/* initialize data */

var fb = new Firebase('https://asdf.firebaseio.com/');

/* set data to automatically update on change */

fb.on('value', function(snapshot) {

  var data = snapshot.val();
  $scope.propertyConfiguration = data.products;
  console.log($scope.propertyConfiguration);
  console.log("Data retrieved");

});

/* save data on button submit */

$scope.saveConfigs = function(){

  var setFBref = new Firebase('https://asdf.firebaseio.com/products');
  setFBref.update($scope.propertyConfiguration);
  console.log("configurations saved!");

};

我有3条哈希路由，分别是“ Shared”，“ Registration”和“ Home”，否则else.redirectTo设置为“
Shared”。（它们都使用此控制器）这是发生的错误：（所有“ links”都是href =“ #hashWhereever“

1）转到 **website.com/#Shared** 或刷新。控制台日志$
scope.propertyConfiguration和“已检索数据”。DOM什么也没显示。

2）单击进入 **website.com/#Registration** ，控制台将正确记录$ scope数据，正确加载了DOM。

3）单击返回 **website.com/#Shared** ，控制台会正确记录$ scope数据，但这次DOM已正确加载。

4）刷新当前正确加载的 **website.com/#Shared** 。DOM元素消失。

由于$
scope.data在这里所有情况下都是正确的，因此Angular是否应确保DOM正确反映了模型？为什么只有当我从另一个链接单击页面时，DOM才能正确加载。

我可以通过添加window.location.hash =“ Shared”来“修复”它，但它会在控制台中引发大量错误。

修正 ：（sorta）

函数$ scope。$ apply（）强制视图与模型同步。我会自己回答这个问题并关闭它，但是我仍然想知道为什么当我为$
scope正确分配一个值时视图不能正确加载。如果Angular的“脏检查”在可能的情况下更改了模型，是否没有为$ scope超值赋值？

Answer 1

Angular无法知道您已为$ scope.variable分配了一个值。这里没有魔术。当您运行指令（ng-click / ng-
submit）或Angular内部函数时，它们都会调用$ apply（）并触发摘要（检查脏标志和更新例程）。

比$ apply可能更安全的方法是使用$timeout。当前，如果您在Firebase中调用写操作，它可能会同步触发事件侦听器（child_added，child_changed，value等）。这可能会导致您仍然在$apply范围内调用$ apply。如果执行此操作，则会引发错误。$ timeout绕过了这个。

有关摘要和$timeout的主题，请参见此SO问题。

《Angular开发人员指南》中的此文档介绍了编译的工作方式；对于任何认真的Angular开发人员来说，都是非常好的背景知识。

另外，您可以通过使用Angular的官方Firebase绑定来节省大量精力，该绑定已经考虑了所有这些实现细节。

模糊相关的注意事项：在不久的将来，Angular将能够利用Object.observe魔术来处理这些更新。