angular ngModel генерирует слишком много ошибок в консоли браузера

Question

Я работаю над простой страницей CRUD.Когда я набираю неправильный код, количество ошибок в консоли браузера внезапно увеличивается.Зачем?На самом деле он имеет только одну или две ошибки

19590 ошибок, 1 предупреждение

.ts:

  document: Document;
  constructor() {
    console.log(this.document.id); //error occurs as I expected
  }

.html:

    <select class="form-control m-input" 
       name="kategori" id="kategori" [(ngModel)]="document.id" >
      <option disabled [ngValue]="null">Please Select</option>
    </select>

Если я удаляю [(ngModel)] = "document.id" ошибки исчезли, и есть только одна ошибка.Что я могу сделать?

Примечание: я не дал новый экземпляр "документа", чтобы эта проблема возникла

Answer 1

сначала вам нужно инициализировать класс Document, как это

document: Document = new Document();

См. Демонстрацию stackblitz здесь: здесь

Answer 2

Хорошо, поэтому вам нужно использовать переменную Document внутри вашего компонента, вам нужно вставить его, как показано ниже:

import {DOCUMENT} from '@angular/common';

export class YourComponent {

    constructor(@Inject(DOCUMENT) private document: any){
           console.log(this.document.id);
    }
}

После этого вы можете использовать его в своем ngModel.