如何在不造成大量延迟的情况下观察对象数组中的变化?

时间:2016-06-06 10:51:12

标签: angular angular2-docheck

我觉得Angular 1中有一些东西在Angular 2中缺失,其中一个是$watch函数。

OnChangesDoCheck应该替换$watch,但我无法使用它们来获得所需的结果。 OnChanges无法监听对象,因此在这种情况下没有用,而DoCheck完成工作时,会导致大量延迟,因为一旦发生变化,它似乎就会变成香蕉。

这里我有一个包含一堆复选框的组件,每个复选框切换都会将一个值添加到数组中,而不是默认的true/false功能。

我需要在此组件中注意的是复选框的isDisabled状态,因此每次更改时我都需要更新isChecked的{​​{1}}状态。

就像我说的那样,它有效,但每次复选框切换都有2-3秒的延迟,尽管只有5个复选框。我希望每次切换复选框时都不希望循环运行,而是只有当复选框的checkbox状态发生变化时才会运行。

编辑:我被告知isDisabled可以在这里完成这项工作,但我找不到任何关于这样的对象数组的例子。它还需要在不调用其Observable方法的情况下触发,因为它必须侦听正在发送的数组的外部更改。

编辑2 :我创建了一个没有显示延迟的plunkr,可能是因为在我的应用程序中我还有其他可能对延迟产生影响的事情。然而,plunkr清楚地表明似乎有一些错误,因为我在next()函数中加了一个console.log(true)并运行了一段时间。这是不可能的,如果是,那真的很奇怪。

以下是plunkr:https://plnkr.co/edit/dJVnqbrredDyWTXNDzDK?p=preview

我该怎么做?

ngDoCheck()

1 个答案:

答案 0 :(得分:1)

this.onModelChange.emit(this.model); this.untoggle(checkbox) ngDoCheck引起的this.onModelChange.emit(this.model);。这是一个完美的无限循环。 ngDoCheck()导致更改检测,因此ngDoCheck运行,循环再次开始。

确保更改检测不会导致更改检测。 <{1}}由变更检测调用,不得再调用其他变更检测,否则会得到无限循环。

Plunker