javascript - 无法使用 Angular 在 html 选择中重置第一项

Question

当我最初在模态窗口中打开它时，我的下拉菜单工作正常。 如果我将选择更改为某个选择下降值，然后关闭模式并重新打开，它会保持不变。它不会将其重置为“未选择”

这就是我正在做的事情

// in my ts file when I open the modal
this.geModal.state = '';

<select class="form-control" name="prState">
                <option [selected]="geModal.state == ''">None selected</option>
                <option *ngFor="let state of stateList"
                [value]="state.code" [selected]="geModal.state == state.code">
                    {{state.name}}
                </option>
            </select>

Answer 1

您不应将[selected]与[ngModel]混合使用，不要使用state的默认值并设置 value="undefined" 默认选项:

<select class="form-control" [(ngModel)]="geModal.state" name="prState">
  <option value="undefined">None selected</option>
  <option *ngFor="let state of stateList" [value]="state.code">{{state.name}}</option>
</select>