Question

我正在使用角度为7.0.4的角度应用程序。

如果我的工作时间列表中的元素多于1，我想将焦点放在模式的第一个输入元素上。问题是，如果我打开模态，则会抛出此异常：

ModalComponent.html:23 ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'ng-untouched: true'. Current value: 'ng-untouched: false'.
    at viewDebugError (core.js:16878)
    at expressionChangedAfterItHasBeenCheckedError (core.js:16866)
    at checkBindingNoChanges (core.js:16968)
    at checkNoChangesNodeInline (core.js:19839)
    at checkNoChangesNode (core.js:19828)
    at debugCheckNoChangesNode (core.js:20432)
    at debugCheckRenderNodeFn (core.js:20386)
    at Object.eval [as updateRenderer] (ModalComponent.html:23)
    at Object.debugUpdateRenderer [as updateRenderer] (core.js:20375)
    at checkNoChangesView (core.js:19729)

该错误发生在modal.component.html文件中的以下代码行上：

<input class="input" type="time" [(ngModel)]="time.From" [autofocus]="workingDay.Times?.length > 1">

[autofocus]指令如下所示：

export class AutoFocusDirective implements OnInit{
  @Input('autofocus') enabled: boolean = true;
  constructor(
    private element: ElementRef
  ) { 
  }

  ngOnInit() {
    if (this.enabled) {
      (this.element.nativeElement as HTMLInputElement).focus();
    }
  }
}

我实际上看不到发生这种情况的原因。

谢谢您的帮助。

Answer 1

尝试添加 (this.element.nativeElement as HTMLInputElement).focus();到setTimeOut

有时绑定不会按照我们的想法发生，并且在摘要周期内绑定中会发生值更改，因此在大多数情况下会发生此错误。

有关更多详细信息，请参阅-

https://blog.angularindepth.com/everything-you-need-to-know-about-the-expressionchangedafterithasbeencheckederror-error-e3fd9ce7dbb4

角度抛出ExpressionChangedAfterItHasBeenCheckedError

1 个答案: