8

最近我发现了一个很棒的库，它允许在 Angular 应用程序中使用 React 组件，称为ngReact

我的问题是关于可以在 reactDirective 组件上声明的watch-depth属性：

<body ng-app="app">
  <div ng-controller="helloController">
    <hello-component watch-depth="reference" fname="person.fname" lname="person.lname"></hello-component>
  </div>
</body>

查看reactDirective 服务的 ngReact 文档，我发现观察深度有 3 个可能的值：

  • 参考
  • 收藏
  • 价值

在我最初使用 ngReact 的探索中，我一直坚持使用默认值选项。

我的问题是，这些类型之间有什么区别？

当每种观察深度类型都适合使用时，简单的例子会很棒！

4

1 回答 1

9

答案与 Angular 的 $watch 的工作原理有关。Angular 有 3 种方式应用 $watch：引用、集合、值（正如您已经提到的）。

参考：

引用查看值的引用，并且仅在该引用更改时才注册更改（并导致重新渲染）。这是最便宜的手表类型。参考更改示例：

$scope.userArray = newUserArray

收藏：

Collection的观看深度更深入。它将查看集合内部。如果 Watch By Reference 被触发，或者如果在集合中添加、删除或重新排序新项目，它将注册更改。

$scope.userArray.push(newUser);

价值：

价值的观察深度是最昂贵的。它将观察集合中的值。如果 Watch By Reference 会被触发，如果 Watch By Collection 会被触发，或者如果集合中的值发生更改，它将注册更改。

$scope.userArray[0].age = 32;

这个答案深受 Tero Parviainen 撰写的一篇优秀文章的启发， https: //teropa.info/blog/2014/01/26/the-three-watch-depths-of-angularjs.html

于 2017-02-22T02:59:25.430 回答