Question

我想从数据库中获取值并将其设置为自动完成输入框中的默认值。

填充clientTypes

clientTypes: any[] = [];
getClientTypes() {
    this.clientService.getClientTypes()
    .subscribe((data: any) => {
        this.clientTypes = [...data];
    });
}

用于自动填充显示

displayFn(object): string {
    console.log(object.ClientTypeId);
    return object.Name;
}

在html中

<mat-form-field appearance="outline">
    <mat-label>Client Type</mat-label>
    <input type="text" placeholder="Select Client Type" aria-label="Number" matInput formControlName="clienttype"  [formControl]="clientTypeControl" [matAutocomplete]="auto3">
    <mat-autocomplete #auto3="matAutocomplete" [displayWith]="displayFn" (optionSelected)='setClientTypeId($event.option.value)'>
        <mat-option *ngFor="let clientType of clientTypes" [value]="clientType">
            {{ clientType.Name }}
        </mat-option>
    </mat-autocomplete>
</mat-form-field>
<br>

当我使用编辑时，我从数据库中获取已保存的accountTypeId。我的问题在于如何将获取的accounTypeId作为默认选项放入matautocomplete中，但仍然可以获得其余的选项？

谢谢。

Answer 1

您可以通过以下两种方式之一来实现这一目标：

在ts文件中创建一个属性，并在ngOnInit上为其指定默认值，并在输入控件中使用模型绑定[(ngModel)]="your property"来设置默认值。
使用patchValues并将值分配给ngOnInit上的表单控件。

如何将从数据库中获取的值设置为Angular Material Autocomplete的默认值

1 个答案: