如何设置初始值以选择Angular中的形式字段

时间:2019-10-29 06:12:45

标签: angular angular-material

我使用api填充了下拉列表,创建了一个自定义选择类型组件。 有一个关于这个的例子。 Stackblitz 我无法为选择类型组件设置初始值。实际上,我将此代码与没有构造函数调用服务的组一起使用,因此无法解决。 https://stackblitz.com/edit/ngx-formly-demo?file=src%2Fapp%2Fforms%2Fgroups%2Faddress.group.ts

1 个答案:

答案 0 :(得分:1)

使用compareWith

  

跟踪用于比较身份的选项比较算法   检查更改。

component.html

<mat-select
    [compareWith]="compareFn" 
      [id]="id"
      [formControl]="formControl"
      [formlyAttributes]="field"
      [multiple]="to.multiple"
      (selectionChange)="to.change && to.change(field, formControl)"
      [errorStateMatcher]="errorStateMatcher"
    >
      <ng-container *ngFor="let item of to.options">
        <mat-option [value]="item" [disabled]="item.disabled">{{
          item.name
        }}</mat-option>
      </ng-container>
    </mat-select>

component.ts

compareFn(o1: any, o2: any) {
    return o1.id === o2.id;
}

Forked Example