在对象数组中使用跟踪，不允许在子项更改上进行渲染

Question

所以我有一个像这样的数组结构：

const array = [
    {
        key: 'xxx1',
        data: [
           {
               key: 'yyy1',
               //...
               propThatWillChangeOverTime: 'foo'
           },
           //...
        ]
    },
    //...
]

在打印上述数组结构的html中，我选择使用两个ng-repeat（嵌套），并且为了获得性能，在两个视图上都使用了track by，类似：

<div ng-repeat="parent in array track by parent.key">
    <div ng-repeat="child in parent.data track by child.key">
        (...)
        <custom-angular-component
            child="child">
        </custom-angular-component>
        (...)
    </div>
</div>

自定义角度组件绑定：子代：'='

现在，propThatWillChangeOverTime将随着时间的变化而变化，但是它永远不会更新值。如果删除第一条曲目，值将更新。但是，这是我无法做到的，因为它将对其他组件产生负面影响。

是否有一种方法可以观看我想“在其值更改时执行某些操作”的属性？

Answer 1

使用$doCheck生命周期挂钩¹

使用version 1.5.8]，AngularJS将$doCheck生命周期挂钩添加到$compile服务。

来自文档：

控制器可以提供以下充当生命周期挂钩的方法：

• $doCheck()-在摘要循环的每一回合调用。提供机会来检测更改并采取措施。您希望对检测到的更改做出响应的任何操作都必须从此挂钩中调用。实现此功能对何时调用$onChanges无效。例如，如果您希望执行深度相等性检查或检查Date对象，而Angular的更改检测器无法检测到该更改，因此不会触发$onChanges，则此钩子可能很有用。该钩子不带参数调用；如果检测到更改，则必须存储以前的值以便与当前值进行比较。

--- AngularJS Comprehensive Directive API Reference — Life-cycle hooks

app.component("customAngularComponent", {
  bindings: {
    child: "<"
  },
  controller: function() {
    var oldPropThatWillChange;
    this.$doCheck = () => {
      if (this.child.propThatWillChange !== oldPropThatWillChange) {
        //"do something with when its value changes"
      };
      oldPropThatWillChange = this.child.propThatWillChange;
    };
  }
})