Question

嗨，我有一个反应式。我的组件html中有一个选择框。我希望我的选择框选择其中一个选项作为默认选择。知道我该怎么办吗？

我也在使用角度5

这是我的表格

this.formGroup = this.fb.group({
      inventories: this.fb.array([]),
      flightRates: this.fb.array([]),
      settings: this.fb.array([]),
      tagonSettings: this.fb.array([])
    });

我的表单组使用表单数组。在tagonSettings表单数组中，我正在推送某个表单组

 this.globalTagonSettingsArray.push(
      new FormGroup({
          id : new FormControl( globalTagonSetting.id ),
          tagonText: new FormControl(globalTagonSetting.tagonText, [Validators.required] ),
          tagonType: new FormControl(globalTagonSetting.tagonType, [Validators.required] )
        }
      )
    );

在下面的html代码中，我有一个选择框。我希望根据formcontrol“ tagonText”的值默认选择其中一个选项。知道我该怎么办吗？

    <div formArrayName="tagonSettings">
       <div class="row" *ngFor="let tagonSettingFormGroup of globalTagonSettingsArray.controls; let i = index">
   <div [formGroup]="tagonSettingFormGroup" >
       <div class="input-group">
           <input formControlName="tagonText">
              <select [formControlName]="tagonType">
                 <option *ngFor="let tagon of tagOns" [value]="tagon.code"> {{ tagon.code }} </option>
              </select>
               </div>
    </div>

            </div>
        </div>

Answer 1

为您提供[value]属性，并将其设置为等于的值。看起来像这样：

<select [value]=1>
  <option value=1>1</option>
  <option value=2>2</option>
</select>

Answer 2

如果您已经知道哪个索引，则可以在以下选项中使用该索引号：

 <select [(ngModel)]="model.xyz">
              <option [value]=0 selected>-- Select --</option>
              <option *ngFor="let opt of optTypes" [value]="opt.id">
                {{opt.name}}
              </option>
    </select>

Answer 3

在创建类似在创建表单控件时设置默认值

  name = new FormControl(1);

在html中使用此控件

  <select  [formControl]='name'> <option value=1>1</option><option value=2>2</option>

我的选择框如何选择一个选项值？

3 个答案: