Раскрывающийся список Угловой материал не отображает правильное значение, когда сделан такой же выбор?

Question

У меня есть поле ввода, в котором пользователь может как печатать, так и выбирать из выпадающего списка. У меня есть три выпадающих [Test1, Test2, Test3]. Всякий раз, когда я меняю раскрывающийся список с Test1 на Test2 или Test3, дисплей заполняется без проблем. Однако, когда я «изменяю» выпадающий список, выбирая Test1 из Test1 (по сути, выбирая тот же выпадающий список, что и текущая выбранная опция), мой HTML отображает [объект объекта]

В моем файле .ts я сделал функцию:

  stringify() {
    let json = JSON.stringify(this.brand.Car);
    json = json.replace(/['"]+/g, '');
    console.log(json);
    return json;
  }

и заменен с [ngModel] = "brand.Car" на [ngModel] = "stringify ()", чтобы увидеть, передавал ли я что-то кроме строки, когда был сделан такой же выбор, но поведение такое же - строка отображается успешно, когда сделан другой выбор, но [объект Object] отображается, когда сделан тот же выбор.

<mat-input-container fxFlex="18" fxFlexOffset="1">
    <input
      matInput
      placeholder="Some placeholder"
      [matAutocomplete]="autocomplete"
      [ngModel]="brand?.Car"
      (ngModelChange)="filter($event)"
      [disabled]="disabled"
    />
    <mat-autocomplete #autocomplete="matAutocomplete" 
(optionSelected)="optionSelected($event)" >
      <mat-option *ngFor="let state of country" [value]="state">
        <span>{{ state?.Car }}</span>
      </mat-option>
    </mat-autocomplete>
</mat-input-container>