我有一个父组件,它使用ajax请求检索对象array.
该组件有两个子组件:一个以树 struct 显示对象,另一个以表格格式呈现其内容.父 node 通过@input属性将数组传递给子 node ,子 node 可以正确显示内容.一切如期而至.
当您更改对象中的某些字段时,就会出现问题:这些更改不会通知子组件.只有手动将数组重新分配给其变量时,才会触发更改.
我已经习惯了使用击倒JS,我需要得到一个类似于耳环的效果.
我不知道多切克是怎么做的.
我有一个父组件,它使用ajax请求检索对象array.
该组件有两个子组件:一个以树 struct 显示对象,另一个以表格格式呈现其内容.父 node 通过@input属性将数组传递给子 node ,子 node 可以正确显示内容.一切如期而至.
当您更改对象中的某些字段时,就会出现问题:这些更改不会通知子组件.只有手动将数组重新分配给其变量时,才会触发更改.
我已经习惯了使用击倒JS,我需要得到一个类似于耳环的效果.
我不知道多切克是怎么做的.
OnChanges
Lifecycle Hook将仅在输入属性的实例更改时触发.
如果要判断输入数组中的元素是否已被添加、移动或移除,可以在DoCheck
Lifecycle钩子中使用IterableDiffers,如下所示:
constructor(private iterableDiffers: IterableDiffers) {
this.iterableDiffer = iterableDiffers.find([]).create(null);
}
ngDoCheck() {
let changes = this.iterableDiffer.diff(this.inputArray);
if (changes) {
console.log('Changes detected!');
}
}
如果需要检测数组中对象的变化,则需要遍历所有元素,并对每个元素应用KeyValueDiffers.(您可以与之前的判断同时进行).
更多信息请访问此帖子:Detect changes in objects inside array in Angular2