错误：ExpressionChangedAfterItHasBeenCheckedError：以前的值：'ng-untouched：true'。当前值：'ng-untouched：false'

Question

我用最少的代码在StackBlitz上重现了这个问题。

第一步：点击文字

第 2 步：专注于文本字段

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

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

Answer 1

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

修改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();
  }