0

我有一个垫子自动完成功能,它会触发一个功能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。

请帮忙。

4

0 回答 0