角度选择的选项ExpressionChangedAfterItHasBeenCheckedError

Question

<select [(ngModel)]="maritalStatus.code" ></select>
<option [value]="1" >Unmarried</option>
<option [value]="3" >Divorced</option>
<option [value]="2" >Married</option>

当我选择其中之一时，我想显示输入并设置所需的内容-

<div *ngIf="maritalStatus.code===2">
  <label> Marriage Date </label>

  <input type="date" #mDate="ngModel" 
  [required]="maritalStatus.code===2" 
  [(ngModel)]="marriageDate"  [ngClass]="{'is-valid':mDate.valid,'is- 
  invalid':mDate.invalid}" > 

  <div *ngIf="mDate.invalid">
  This field is required.
  </div>

</div>

<div *ngIf="maritalStatus.code===3">
   <label> Divorce Date </label>

   <input type="date" #dDate="ngModel" [required]="maritalStatus.code===3" 
   [(ngModel)]="divorceDate" [ngClass]="{'is-valid':dDate.valid,'is- 
  invalid':dDate.invalid}"  > 

   <div *ngIf="Date.invalid">
  This field is required.
  </div>

</div>

当我更改所选选项时，会发生此错误：

  

错误错误：ExpressionChangedAfterItHasBeenCheckedError：表达   检查后已更改。先前的值：'is-valid：true'。   当前值：“有效”：false。

注意：我正在使用BS4。