我的选择框如何选择选项值？答案

【问题标题】：How can my select box has an option value selected?我的选择框如何选择选项值？
【发布时间】：2020-03-03 06:15:57
【问题描述】：

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

我也在使用 angular 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>

【问题讨论】：

How to set value to form control in Reactive Forms in Angular的可能重复
不是重复的。这是一个不同的场景。这不是基本情况。在这种情况下，我将表单组添加到表单数组中。这些表单组可以删除或添加。我怎么需要一种方法来选择它。
@KnowledgeSeeker001 你能为它创建一个stackbliz吗

标签： angular

【解决方案1】：

给你一个 [value] 属性并将其设置为等于 . 看起来像这样：

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

【讨论】：

【解决方案2】：

如果您已经知道哪个索引，那么您可以在选项上使用该索引号，如下所示：

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

【讨论】：

【解决方案3】：

您在创建表单时使用设置默认值创建表单控件时设置默认值

  name = new FormControl(1);

在 html 中使用这个控件

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

【讨论】：