未捕获的错误：ExpressionChangedAfterItHasBeenCheckedError：检查后表达式已更改

Question

未捕获的错误：ExpressionChangedAfterItHasBeenCheckedError：检查后表达式已更改。 以前的值：'ngIf：false'。 当前值：'ngIf：

在转到同一组件中的几个子页面后，我一直试图在单击按钮时获取更新的值， YES和NO值不会更新（仅在当前页面上有效），尽管我可以通过控制台日志看到它方法。 下面是我的代码。 我试过下面的网址

ngIf - 检查后表达式已更改

  constructor(
  ) {

  }
 getAssessBtn1(value: any) {    
    this.assesseeValidation = false;
    if (value == 'Yes') {
      this.showAssessBtn1 = true;
      this.showAssessCondition1 = false;
    } else {
      this.showAssessBtn1 = false;
    }
  } 

我正在尝试使用 ngAfterViewChecked，如何在其中使用getAssessBtn1(value: any)方法。

HTML :

<button data-auto-id="AdultTravellersAssess" *ngIf="showAssessBtn1 
                          class="btn btn-secondary assess-btn custom-theme-group-two"
                          (click)="test()">
                    Access
              

Answer 1

您可以使用ChangeDetectionRef改变后触发变化检测事件右showAssessBtn或showAssesCondition1 。

// inject the changeDetectionRef into your component with
constructor(private cd: ChangeDetectionRef) {}


// in the getAssessBtn1 method trigger change detection
getAssessBtn1(value: any) {
 this.assesseeValidation = false;
 if (value == 'Yes') {
   this.showAssessBtn1 = true;
   this.showAssessCondition1 = false;
 } else {
   this.showAssessBtn1 = false;
 }
 this.cd.detectChanges();
}

使用这种方法，angular 不会抱怨检查值后表达式更改。 因为当您将表达式设置为另一个值时，您正在重新触发更改检测事件。