离子警报控制器阻止页面刷新

Question

我是Ionic-Angular的新手。问题是我有一个matauto补全和图标。当您在matauto补全中选择一个值时，下面会显示一个列表。单击图标时，我将显示ionic alertControl，选择确定时，以编程方式设置matauto补全的值。虽然值在matauto补全中设置，但列表并不刷新。然后当我再次单击图标或更改窗口时，列表会刷新。

async showBranches() {
    // this.autocomplete.closePanel();
    const alert = await this.alertController.create({
      header: 'Branch Locations',
      inputs: this.branchArray,
      buttons: [
        {
          text: "CANCEL",
          handler: data => {
            console.log("cancel clicked");
          }
        },
        {
          text: "OK",
          handler: data => {
            console.log("branchId: " + data);
            this.branchID = data;
            this.setBlankOrSelectedBranch();
            
          }
        }],
      cssClass: 'alertCustomCss'
    });
    await alert.present();
  }

<div class="col90">
              <mat-form-field class="fullWidth">
                <input type="text" placeholder="Select Branch Location" matInput [formControl]="myBranch"
                  [matAutocomplete]="auto">
                <mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn" (optionSelected)='onBranchSelected($event.option.value)'>
                  <mat-option *ngFor="let branch of filteredBranches | async" [value]="branch">
                    {{branch.branchName}}
                  </mat-option>
                </mat-autocomplete>
              </mat-form-field>
              <ion-icon name="finger-print" matSuffix class="thumb" (click)="showBranches()"></ion-icon>
            </div>

Answer 1

异步操作可能不会触发Angular重新渲染视图，您可以尝试手动通知Angular重新渲染

import { NgZone } from '@angular/core';

constructor(public _ngZone:NgZone){}

public refresh() {
  this._ngZone.run(() => {});
}