首页 > 解决方案 > angular :检查后更改。以前的值:'null'

问题描述

core.js:6162 ERROR Error: NG0100:
ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked.
Previous value: 'null'. Current value: '{

我试图访问{{dispositionDetails?.metricsData | json}}它显示的对象,但它给了我上面提到的错误

我们如何解决这个问题?正如您在下面的代码中看到的那样,dispositionDetails它来自标签。#dispositionDetails任何可能有帮助的想法?

#ts 代码

export class DealDetailsComponent implements OnInit {
  @ViewChild('pmrDetails') pmrDetails: any;
  @ViewChild('dispositionDetails') dispositionDetails: any;

#html代码

<div class="page-content-details" *ngIf="urlData">
  <div class="page-content-details-left">
    <div>  
      <app-deal-pmr #pmrDetails
        *ngIf="urlData.dealType === 'Portfolio Management Restructure'"
        (gotoManageDealsEvent)="goBack()"
        (setIsInEditMode)="setIsInEditMode($event)"
        [dealData]="dealDetails"
        [transactionData]="urlData.transaction"
        [leaseDetails]="leaseDetails">
      </app-deal-pmr>    
      <app-deal-idle-disposition #dispositionDetails
        *ngIf="urlData.dealType === 'Idle Disposition'"
        (gotoManageDealsEvent)="goBack()"
        (setIsInEditMode)="setIsInEditMode($event)"
        [dealData]="dealDetails"
        [transactionData]="urlData.transaction"
        [leaseDetails]="leaseDetails">
      </app-deal-idle-disposition>
      <app-deal-partnership
        *ngIf="urlData.dealType === 'Partnership'"
        (gotoManageDealsEvent)="goBack()"
        [dealData]="dealDetails"
        [transactionData]="urlData.transaction"
        [leaseDetails]="leaseDetails">
      </app-deal-partnership>      
    </div>
    <app-page-section-cards [header]="pageSectionsOptions.checkList">
            <div sectionContent>        
      </div>
    </app-page-section-cards>


    {{dispositionDetails?.metricsData | json}}

    <app-page-section-cards [header]="pageSectionsOptions.metrics">
            <div sectionContent>             
        <app-deal-metrics 
          *ngIf="!isInEditMode"                
          [isInEditMode]="isInEditMode" 
          [dealData]="dealDetails"          
          [dealType]="urlData.dealType">
        </app-deal-metrics>   
        <app-deal-metrics    
          *ngIf="isInEditMode"       
          [isInEditMode]="isInEditMode" 
          [editData]="pmrDetails?.metricsData || dispositionDetails?.metricsData"
          [dealType]="urlData.dealType">
        </app-deal-metrics>             
      </div>
    </app-page-section-cards>   
  </div>

在此处输入图像描述

在此处输入图像描述

标签: javascriptangulartypescript

解决方案


角度生命周期挂钩的问题。请参阅https://angular.io/guide/lifecycle-hooks 据我所知,此错误仅在开发中引发。

尝试从 ngOnInit / 构造函数中设置 pmrDetails , dispositionDetails 的默认值。


推荐阅读