Сегодня я обновил свой проект Angular с Angular 8 до Angular 10, и теперь я получаю следующую ошибку, когда пытаюсь изменить поле ввода в диалоговом окне материалов
ERROR TypeError: Cannot assign to read only property 'listName' of object '[object Object]'
at SaveListDialogComponent_Template_input_ngModelChange_7_listener (template.html:9)
Исследование в Интернете показало, что это связано с NgRx, но у меня его нет в проекте
HTML:
<form #saveListForm="ngForm" class="save-form" novalidate>
<div mat-dialog-content>
<mat-form-field class="name-input">
<input type="text" matInput placeholder="List Name" id="listName" name="listName"
[(ngModel)]='list.listName' maxlength="50" required #listName="ngModel">
<mat-error *ngIf="listName.errors?.required">
List Name is <strong>required</strong>
</mat-error>
<mat-error *ngIf="listName.errors?.maxlength">
Name must be less than 50 characters
</mat-error>
</mat-form-field>
</div>
</form>
Компонент:
export class SaveListDialogComponent {
constructor(public dialogRef: MatDialogRef<SaveListDialogComponent>,
@Inject(MAT_DIALOG_DATA) public list: List) {}
onSaveClick(): void {
this.dialogRef.close(this.list);
}
onCancelClick(): void {
this.dialogRef.close();
}
}
Интерфейс списка:
export interface List {
listName: string | null;
listDescription: string | null;
}