错误：ExpressionChangedAfterItHasBeenCheckedError：先前值：“ng-untouched：true”。当前值：'ng-untouched: false'

我已重现该问题堆栈闪电战 https://stackblitz.com/edit/angular-iah7up用最少的代码。

第1步：点击文字

第 2 步：将焦点放在文本字段上

步骤 3：输入 Enter 并检查控制台是否有此错误

错误：ExpressionChangedAfterItHasBeenCheckedError：表达式有 检查后更改了。以前的值：'ng-untouched：true'。 当前值：'ng-untouched: false'。

您必须使用以下命令手动触发指令中的更改检测detectChanges()的方法ChangeDetectorRef

Modify editable-on-enter-inplace.directive.ts像这样：

import { Directive,HostListener ,ChangeDetectorRef} from '@angular/core';

 constructor(private editable: EditableInplaceComponent,private cdr: ChangeDetectorRef) { }

  @HostListener('keyup.enter')
  onEnter() {
    this.editable.toViewMode();
    this.cdr.detectChanges();
  }