垫子步进器以编程方式更改时,垫子自动完成功能不会关闭

时间:2020-09-29 23:07:21

标签: angular angular-material mat-autocomplete

我有一个垫子自动完成功能,可触发optionSelected()上的功能

<mat-form-field fxLayout="column">
    <input  matInput
            [matAutocomplete]="auto"
            #trigger="matAutocompleteTrigger"
            formControlName="shop">
    <mat-autocomplete   #auto="matAutocomplete"
                        [displayWith]="displayFn" 
                        (optionSelected)="selectedShop($event, stepper)">
                        <mat-option>...</mat-option>
                        </mat-autocomplete>
</mat-form-field>

以上表格位于mat-stepper组件内部。在optionSelected上,我具有以下功能

selectedShop(event, stepper) {

    const shopData = event.option.value as Shop;

    if(shopData) {
      this.registerForm.patchValue({ secondaryMobile: shopData.secondaryMobile });
      stepper.next();
    }
}

当某人选择自动完成时,它将设置反应形式的值并移至下一个步进器。并且可以正常运行,但“自动完成”下拉面板仍位于顶部。

我累了

@ViewChild(MatAutocompleteTrigger) autocompleteTrigger: MatAutocompleteTrigger;

if(shopData) {
      this.registerForm.patchValue({ secondaryMobile: shopData.secondaryMobile });
      stepper.next();
      this.autocompleteTrigger.closePanel();
}

也在ngAfterViewInit()内尝试,但失败了。面板永远不会关闭。我正在使用角度版本10。

请帮助。

0 个答案:

没有答案