angular - FakeAsync/tick(Async/whenStable)与detectChanges()

您能帮我区分这两件事吗？

根据我的理解，如果仅使用可观察对象，则可以使用detectChanges()。因此，您可以直接更改组件属性或监视服务调用并返回一个observable，然后调用detectChanges()，更改将在html元素上可用。

但是对于输入字段上的[[ngModel)]，您需要调用tick()才能将更改呈现在html元素上。

因此，如果我知道他们的工作和何时使用的话，那将是很棒的。

提前致谢。

最佳答案

detectChanges

ViewRef上提供了detectChanges方法。

class ViewRef extends ChangeDetectorRef {
  // inherited from core/ChangeDetectorRef
  markForCheck(): void   <-----------------------------
  detach(): void
  detectChanges(): void
  checkNoChanges(): void
  reattach(): void
}

ViewRef是组件的基础表示。当编写测试而不是ViewRef时，引入了另一个抽象，即fixture:

fixture = TestBed.createComponent(BannerComponent);

它包装类似于ViewRef的组件。
detectChanges方法对基础组件运行更改检测，并执行以下操作:

更新输入绑定(bind)属性

更新DOM

和许多其他。

要了解更多信息，您可以阅读Everything you need to know about change detection in Angular。因此，为了验证DOM中的更改或验证输入绑定(bind)，您需要运行detectChanges。

打钩

Angular docs很好地描述了它:



使用ngModel您需要调用它，因为在ngModel内部创建的控件是异步注册的。这是the article by Victor Savkin on forms的报价: