Я использую mat-select внутри таблицы (так, чтобы в каждой строке был один), который будет отображаться при выборе строки для редактирования.
Mat-select имеет * ngIf для скрыть, когда не в режиме редактирования. Он также заполняется картой ключ / значение внутри компонента. Значения принимаются и устанавливаются во время ловушки жизненного цикла ngOnInit. Выбор циновки также НЕ выполняется в форме.
Когда я выбираю режим редактирования, появляется выбор циновки, но он показывает пустую опцию, заставляя пользователей повторно выбирать опцию, уже примененную к строке. Я могу подтвердить, что их ключи и значения установлены правильно, и значение объекта для typeId также установлено.
Я пробовал несколько вещей, которые я обнаружил при переполнении стека, но до сих пор ни одна не работала. (например, используя выбранный атрибут, используя [(значение)] в mat-select и пытаясь написать метод для установки его при появлении).
Как я могу отобразить mat-select с помощью * ngIf и текущее значение отображается по умолчанию?
HTML
<ng-container [matColumnDef]="myColumn">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Column 1</th>
<td mat-cell *matCellDef="let object">
<mat-form-field *ngIf="object.edit">
<mat-select #objectTypeId="ngModel"
placeholder="Type"
disableOptionCentering
[(ngModel)]="object.objectTypeId"
[(value)]="object.objectTypeId"
required>
<mat-option *ngFor="let objectType of objectTypeSelectViewModel?.map | keyvalue" value="{{objectType?.key}}">
{{objectType?.value}}
</mat-option>
</mat-select>
</mat-form-field>
<span *ngIf="!object.edit">{{object?.objectType}}</span>
</td>
</ng-container>