Angular 11 - select 下拉列表中的第一项

Question

简单的事情；我希望下拉列表中的第一项 (mat-select) 在页面加载时自动 selected。
下面的代码是我最好的猜测，但没有用，我仍然看到一个空文本，我必须手动下拉菜单和 select 第一项。你知道为什么或如何解决它吗？谢谢。

    <mat-form-field>
        <mat-label>Title</mat-label>
        <mat-select [(ngModel)]="selectedTitle" [(value)]="titleList[0].titleval">
            <mat-option *ngFor="let singleTitle of titleList" [value]="singleTitle.titleval">
                {{singleTitle.titletxt}}
            </mat-option>
        </mat-select>
    </mat-form-field>

Answer 1

让angular为你做

在您的 TS 文件中，例如在您的 ngOnInit()

this.selectedTitle = this.titleList[0].titleval

和你的html

<mat-form-field>
    <mat-label>Title</mat-label>
    <mat-select [(ngModel)]="selectedTitle">
        <mat-option *ngFor="let singleTitle of titleList" [value]="singleTitle.titleval">
            {{singleTitle.titletxt}}
        </mat-option>
    </mat-select>
</mat-form-field>

angular 将为您 select 第一项

Angular 11 - select 下拉列表中的第一项

Angular 11 - select first item in a dropdown list

angular

angular-forms