Angular 9：如何重新渲染组件

Question

我有一个父组件和一个子组件。如果子组件在内部更新其值，我无法从父组件更新回值。

请参阅此 Stackblitz 中的示例：https ://stackblitz.com/edit/angular-ivy-tynepp 。当子组件失去焦点时，我会触发一个事件，父组件会重置子组件的值。但我认为，因为父级的“this.value”没有改变，所以更新不会触发子级的检测更改。

我该如何解决这个困境？

Answer 1

正如你所说，变化检测没有被触发，因为绑定值没有改变。您可以通过以下步骤强制更新数据绑定：

1. 设置临时值
2. 称呼ChangeDetectorRef.detectChanges()
3. 重置值

constructor(private changeDetectorRef: ChangeDetectorRef) {}

resetValue() {
  this.value = "____TempValue____";
  this.changeDetectorRef.detectChanges();
  this.value = "";
}

请参阅此 stackblitz的演示。