在范围与父范围内观察相同的值变化 - 是否存在差异？

Question

我对Angular手表有一个非常基本的问题。假设我在我的指令的链接功能中有以下内容：

scope.$watch(function(){
    return element.isVisible();
  }, myFuncUponVisibleChange);

这是否与：

相同

scope.$parent.$watch(function(){
     return element.isVisible();
  }, myFuncUponVisibleChange);

换句话说，Angular是否正在观察上述两种情况下相同元素的可见性？

Answer 1

是的。 $element不会发生变化，因为您在声明该函数时捕获了该范围内的$element引用（JavaScript范围，而不是Angular范围）。

现在，如果你做了这样的事情：

scope.$parent.$watch('$element.isVisible()', myFuncUponVisibleChange);

然后这将完全不同，因为此时您将引用父作用域中的$element，而不是其他作用域。

Answer 2

是的，两个范围观察者都在同一个元素上观察，因为element引用了特定的对象，并且在观察者函数中引用了它。

是的，存在很大差异。

AngularJS中的许多性能问题都是由于摘要周期影响整个范围层次结构。换句话说，$scope.$apply()从上到下触发所有观察者。

一旦应用程序足够复杂（它总是取决于客户端和应用程序，但为了简单起见，通常估计关键点约为1000个观察者），它在摘要上开始变得无法响应。

优化此方法的一种好方法是封装指令更改并使指令不在根范围内宣布摘要，除非全局摘要是所需行为。在这种情况下，可以调用$scope.$digest()而不是$scope.$apply()（这两者之间的根本区别在于后者calls $rootScope.$digest()）。

差异来了。 scope.$parent.$watch(...)不会触发$scope.$digest()观察者，但它会在$scope.$apply()上。它说明了为什么指令隔离很重要以及为什么从孩子那里引用父范围是坏习惯。

另一个令人不快的惊喜是scope.$parent.$watch(...)可能导致内存泄漏。如果拥有scope的元素被销毁，则不会自动清理观察者。它将引用分离的element，防止对象被垃圾收集。

$scope.$parent是邪恶的。