Установка значения по умолчанию для mat-select, где мой выбор использует функцию?

Question

Я новичок в Angular и сталкиваюсь с тем, что, я уверен, является простым решением.

Поэтому я пытаюсь установить значение по умолчанию для моего выбора мата, чтобы он был моим «активным» вариантом. При выборе я вызываю эту функцию, которая будет фильтровать таблицу для меня. Однако у меня возникли проблемы с использованием [(value)] или ngModel, так как они, похоже, принимают только переменные вместо функции?

<mat-form-field appearance="outline"
                class="detail-filter-menu">
  <mat-label>Filter</mat-label>
  <mat-select [(value)]="true" (selectionChange)="this.filterService.applyFilter($event.value, dataSource)">
    <mat-option value="true">Active</mat-option>
    <mat-option value="false">Inactive</mat-option>
    <mat-option value="all">All</mat-option>
  </mat-select>
</mat-form-field>

Есть ли способ использовать ngModel или что-то еще для достижения выбора по умолчанию?

Answer 1

Если вы хотите установить значение по умолчанию с помощью функции, вы можете сделать это следующим образом:

Код шаблона

<mat-form-field appearance="outline">
  <mat-label>Filter</mat-label>
  <mat-select [value]="myFunction()" (selectionChange)="changed($event.value)">
    <mat-option value="active">Active</mat-option>
    <mat-option value="inactive">Inactive</mat-option>
    <mat-option value="all">All</mat-option>
  </mat-select>
</mat-form-field>

Код компонента

myFunction() {
  return 'active';
}

Вытакже можно просто установить его без функции, например:

<mat-select [value]="'active'">

Проверьте stackblitz .