Question

当前在Angular 7上。组件输入是一个布尔值，在进入和退出不确定状态后可能保持不变。

例如：我有可扩展的行，可以单独打开或一次全部打开。

this.expand最初将为false。

通过this.expand = true打开所有行

用户分别折叠每一行

通过this.expand = true，什么也没发生。没有检测到变化。

代码将显示我如何通过settimeout（）处理此问题，但正在寻找更清洁的解决方案。

  expandAll() {
    // if 'expanded' is already true we have to force push the update
    if (this.expanded) {
      this.expanded = false;
      setTimeout(() => {
        this.expanded = true;
      }, 0);
    } else {
      this.expanded = true;
    }
  }

希望在不使用此异步代码的情况下强制进行更改检测。

Answer 1

希望在不使用此异步代码的情况下强制进行更改检测。

您可以在此处利用Angular更改检测，尝试以下代码，这将迫使更改检测手动运行并考虑Boolean值的切换。

依次将更改传播到DOM中。

import { ChangeDetectorRef } from '@angular/core';

constructor(private ref: ChangeDetectorRef){}

public expandAll(): void
{
    this.expanded = !this.expanded; // toggles Boolean value
    this.ref.detectChanges(); // forces change detection to run
}

Change Detection Ref来自Angular文档。

Answer 2

使用EventEmitter创建事件，如果下拉列表很多，则可能必须动态化，但可以解决更改事件问题。

查看

您还可以使用@Hostlistener来查看点击情况。请参阅我的StackBlitz示例。

如果您需要更多帮助，我会在这里，只需发表评论或给我发消息。

当输入值不变时，如何对输入强制进行变化检测

2 个答案: