Angular 17中如何将*ngFor替换为@For语法？

Angular 17引入的新控制流语法中，@for 是 *ngFor 的替代方案，以下是转换后的完整代码：

<mat-form-field>
    <mat-label>Nationality</mat-label>
    <mat-select formControlName="nationality">
        @for(nationality of nationalities; track nationality) {
            <mat-option [value]="nationality">
                {{ nationality }}
            </mat-option>
        }
    </mat-select>
</mat-form-field>

关键说明： #

• 替换原有的 *ngFor="let nationality of nationalities" 为 @for(nationality of nationalities; track nationality)，无需额外的let关键字
• track 是新控制流的必填项，用于帮助Angular高效识别列表项的变化。这里因为nationality是唯一的字符串值，直接用它作为跟踪标识即可
• 循环体内容需要包裹在大括号 {} 中

内容的提问来源于stack exchange，提问作者Zeus