我有一个带有多个控件的动态表单。我试图动态地将mat-autocomplete称为一个控件,但是我无法获取选项列表。不确定我在哪里做错了吗? 这是我的自动填充动态组件。
<div *ngSwitchCase="'autoComplete'">
<mat-form-field class="col-md-12">
<input type="text"
matInput
class="form-control col-md-12 col-xs-12"
[formControlName]="question.key"
[matAutocomplete]="auto">
<mat-autocomplete autoActiveFirstOption #auto="matAutocomplete">
<mat-option *ngFor="let option of question.options | async" [value]="option">
{{option}}
</mat-option>
</mat-autocomplete>
</mat-form-field>
</div>
这是我的消息来源,我如何称呼上述控件
{
"key": "businessDescription",
"label": "Description of business :",
"type": "text",
"controlType": "autoComplete",
"options": this.filteredOptions,
"description": "",
"horizontalRule": true,
},
如果不使用超时,表单将引发未定义的错误。
options: string[] = ['One', 'Two', 'Three'];
filteredOptions: Observable<string[]>;
ngOnInit() {
setTimeout(()=>{
this.filteredOptions = this.appDetailFormComponent.form.get('businessDescription').valueChanges.pipe(
startWith(''),
map(value => this._filter(value))
);
})
}
private _filter(value: string): string[] {
const filterValue = value.toLowerCase();
return this.options.filter(option => option.toLowerCase().indexOf(filterValue) === 0);}
这里有任何指南可解决此问题:(