Блог

Я пытаюсь очистить поле даты, и пользователь должен ввести дату вручную. Я использую материал угловой даты.

Вот в чем моя ошибка

Вот мой html-код.

 lt;div *ngFor="let item of dialogData?.milestoneData?.maintenanceCountryAssumption; let mcaIndex=index"gt; lt;div *ngFor="let element of item.trialDesignElement; let elementIndex=index;"gt;  {{item.trialDesignElement}}  lt;div class="row"gt;  lt;div class="col-md-4"gt;  {{ element.trialName}}  lt;/divgt;  lt;div class="col-md-4"gt;  lt;mat-form-field *ngIf="element.firstPatientInDate"gt;  lt;input [disabled]="!enableEdit"  (dateChange)="setChange(mcaIndex, elementIndex,'firstPatientInDate', $event)" matInput  [matDatepicker]="fpd" placeholder="Choose a date"  [value]="getData(element.firstPatientInDate)" name="{{elementIndex}}--{{mcaIndex}}"gt;  lt;button mat-button *ngIf="element.firstPatientInDate" matSuffix mat-icon-button  aria-label="Clear" (click)="clearFirstDateField(mcaIndex, elementIndex)"gt;  lt;mat-icongt;closelt;/mat-icongt;  lt;/buttongt;  lt;mat-datepicker-toggle matSuffix [for]="fpd"gt;lt;/mat-datepicker-togglegt;  lt;mat-datepicker #fpdgt;lt;/mat-datepickergt;  lt;/mat-form-fieldgt;  lt;mat-form-field *ngIf="!element.firstPatientInDate"gt;  lt;input (dateChange)="setChange(mcaIndex, elementIndex,'firstPatientInDate', $event)" matInput  [matDatepicker]="dup" placeholder="Choose a date" name="{{elementIndex}}--{{mcaIndex}}"  [(ngModel)]="element.firstPatientInDate"gt;  lt;button mat-button *ngIf="element.firstPatientInDate" matSuffix mat-icon-button  aria-label="Clear" (click)="clearSecondDateField(mcaIndex, elementIndex)"gt;  lt;mat-icongt;closelt;/mat-icongt;  lt;/buttongt;  lt;mat-datepicker-toggle matSuffix [for]="dup"gt;lt;/mat-datepicker-togglegt;  lt;mat-datepicker #dupgt;lt;/mat-datepickergt;  lt;/mat-form-fieldgt;  lt;/divgt;  lt;div class="col-md-4"gt;  lt;mat-form-field *ngIf="element.lastPatientInDate"gt;  lt;input [disabled]="!enableEdit" required [ngClass]="{'lpiError': element.lpiError}" matInput  [matDatepicker]="dup3" [min]="dateFilter(element.firstPatientInDate)"  name="{{elementIndex 1}}--{{mcaIndex}}" placeholder="Choose a date"  [value]="getData(element.lastPatientInDate)"gt;  lt;button mat-button *ngIf="element.lastPatientInDate" matSuffix mat-icon-button  aria-label="Clear" (click)="clearLPIFirstDateField(mcaIndex, elementIndex);"gt;  lt;mat-icongt;closelt;/mat-icongt;  lt;/buttongt;  lt;mat-datepicker-toggle matSuffix [for]="dup3"gt;lt;/mat-datepicker-togglegt;  lt;mat-datepicker #dup3gt;lt;/mat-datepickergt;  lt;/mat-form-fieldgt;  lt;mat-form-field *ngIf="!element.lastPatientInDate"gt;  lt;input required [ngClass]="{'lpiError': element.lpiError}"  (dateChange)="setChange(macIndex, elementIndex,'lastPatientInDate', $event)" matInput  [matDatepicker]="dup4" [min]="dateFilter(element.firstPatientInDate)"  name="{{elementIndex 1}}--{{mcaIndex}}" placeholder="Choose a date"  [(ngModel)]="element.lastPatientInDate"gt;  lt;button mat-button *ngIf="element.lastPatientInDate" matSuffix mat-icon-button  aria-label="Clear" (click)="clearLPISecondDateField(mcaIndex, elementIndex);"gt;  lt;mat-icongt;closelt;/mat-icongt;  lt;/buttongt;  lt;mat-datepicker-toggle matSuffix [for]="dup4"gt;lt;/mat-datepicker-togglegt;  lt;mat-datepicker #dup4gt;lt;/mat-datepickergt;  lt;/mat-form-fieldgt;   lt;/divgt;  lt;/divgt; lt;/divgt;  

Вот мой код ts.

 clearFirstDateField(mcaIndex, elementIndex) { this.dialogData.milestoneData.maintenanceCountryAssumption[mcaIndex].trialDesignElement[elementIndex]. firstPatientInDate = '';  

}

На самом деле я получаю ошибку в *ngIf="element.firstPatientInDate"

в консоли я могу видеть FPID

Пожалуйста, дайте мне знать, что я здесь делаю не так.