Question

我是 Angular 的新手。我在选择和默认选项方面有问题。我有一系列汽车品牌，它们在选项标签中显示为 ngFor，我有“Seleccione una marca”这将是默认选项。这是代码。

<div class="form-group float-label-control" [ngClass]="{ 'has-error': formStep2.submitted && !brand.valid }">
    <label for="brand" title="Este campo es obligatorio">Marca*</label>
    <select class="form-control" name="brand" id="brand" [(ngModel)]="stepTwo.brand" #brand="ngModel" (change)="getModels(stepTwo.brand)" required>
      <option value="">Seleccione una marca</option>
      <option *ngFor="let brand of brands" [ngValue]="brand">{{ brand.descripcion }}</option>
     </select>
   <div *ngIf="formStep2.submitted && !brand.valid" class="help-block text-danger">Campo requerido</div>
</div>

问题是默认情况下该选项是空白的，单击时它包含“Seleccione una marca”和所有品牌数组。未将“Seleccione una marca”设为默认选项。提前感谢您抽出宝贵时间。

编辑我设法解决它。通过使用我喜欢用作默认值的选项值初始化 ngModel 属性。在这种情况下，我做了这样的事情。

this.stepTwo.brand = "";

哇，问题解决了。

Answer 1

这将帮助您设置选择的默认值：

<select [(ngModel)]="selectedOption"></select>

并在类中添加：

export class AppComponent {
  selectedOption = 'Seleccione una marca';
}

Answer 2

尝试使用：

<select class="form-control" name="brand" id="brand" [(ngModel)]="stepTwo.brand" 
                    #brand="ngModel" (change)="getModels(stepTwo.brand)" required>          
   <option *ngFor="let brand of brands" value="{{brand.descripcion}}">{{ brand.descripcion }} 
   </option>
</select>

并用它的默认值初始化 ngModel

this.stepTwo.brand = 'Seleccione una marca';

默认值选择选项角度

2 个答案: