首页 > 解决方案 > 在选择选项中设置默认静态值

问题描述

我在设置select标签的默认值时遇到问题。这是我的一些片段:

<select class="form-control" id="field_company" name="company" formControlName="company">
    <option value="null" [selected]="true"> {{ 'khanbankCpmsApp.company.default' | translate }}</option>
    <option
        [ngValue]="companyOption.id === editForm.get('company').value?.id ? editForm.get('company').value : companyOption"
                *ngFor="let companyOption of companies;"
    >
       {{ companyOption.name }}</option>
</select>

默认情况下,该静态值应显示在选择上。但结果是:

在此处输入图像描述

我做错了什么 ?有什么建议吗?

在此处输入图像描述

标签: angularangular7

解决方案


您正在使用反应式表单,因此您需要将 FormControl 设置为您的 formGroup 之类的。

<form [formGroup]="companyGroup">
    <select class="form-control"  name="company" formControlName="company">
        <option value="1"> One </option>
        <option value="2"> Two </option>
        <option value="3"> Three </option>
    </select>
</form>

和 .ts 文件包含

export class HelloComponent implements OnInit {
  @Input() name: string;
  companyGroup: FormGroup;

  constructor(private fb: FormBuilder) {

  }

  ngOnInit() {
    this.companyGroup = this.fb.group({
      company : ''
    })
    this.companyGroup.get('company').patchValue('2');
  }
}

演示链接在这里


推荐阅读