Mat-autocomplete 显示的是从服务器收到的前一个日期，但不是最新的。我怎样才能修复它以显示收到的最新数据？

Question

ngOnInit(): void {
    this.filteredAccountOptions = this.accountControl.valueChanges
    .pipe(
      startWith(''),
      map(value => this.accountFilter(value))
    );
    .
    .
    .

Actually the "return this.createDialogService.accountOptions" statement is executed before the subscription part is fulfilled in its previous line in the "accountSearch(value)" method. That's why the previous data is shown.

private accountFilter(value: string): string[] {
    this.accountSearch(value);
    return this.createDialogService.accountOptions
  }

accountSearch(searchedValue: string) {
    this.createDialogService.searchAccount(searchedValue).subscribe(
      (success) => {
        this.createDialogService.accountOptions = JSON.parse(success.message)
      },
      (error) => {}
    )
  }

My HTML

<input type="text" matInput [formControl]="accountControl" [matAutocomplete]="auto1">
    <mat-autocomplete #auto1="matAutocomplete">
        <mat-option *ngFor="let option of filteredAccountOptions | async" [value]="option.Name">
             {{option.Name}}
        </mat-option>
    </mat-autocomplete>

Answer 1

因为您在 return Observable 之后更改了数据，使用 swithMap 运算符。为避免服务器过载，请使用 debounceTime.

  ngOnInit(): void {
    this.filteredAccountOptions = this.accountControl.valueChanges.pipe(
      startWith(''),
      debounceTime(3000),
      switchMap(value => this._accountFilter(value)),
    );
  }

  private _accountSearch(searchedValue: string): Observable<any> {
    return this.createDialogService.searchAccount(searchedValue).pipe(
      map(success =>  JSON.parse(success.message)),
    );
  }

Mat-autocomplete 显示的是从服务器收到的前一个日期，但不是最新的。我怎样才能修复它以显示收到的最新数据？

Mat-autocomplete is showing the previous date received from the server but not the latest. How can I fix it to show the latest data received?

angular

typescript

observable

subscription

mat-autocomplete