angular - Angular 5 自动完成功能不适用于第一次通话

Question

我正在使用ng5-auto-complete库在角度 5 中自动完成。

当我输入一个字符时，API 调用会获取要显示的建议并将其设置为数组。

onChanges():void {
this.newPLApplication.get('pLApplicationDetails').get('applicantOccupationDetailsDTO').get('companyName')
  .valueChanges
  .subscribe(
    term => {
      if (term != '') {
        console.log('got output yo');
        this.nPLApplication.getCompanyListByLetters(term)
          .subscribe((value: any) => {
            if (value.data!=null)
              this.setList(value.data);    
          });
      }
   })
 }

setList 函数设置要在建议中显示的列表。

我希望每当我输入一个字符时，它都会从 api 获取结果并将它们显示在列表中。但问题是第一个字符没有出现列表。当输入更多字符时它工作正常。

例如：当我重新加载页面并输入“a”时，它显示“未找到记录”。当我继续输入“aa”时，它会向我显示来自 api 的建议。现在，当我按下退格键时，输入再次变为“a”，这一次会显示建议。

这是我在 html 中的代码：

<input class="form-control" type="text" 
    formControlName="companyName" 
    (blur)="onBlur($event)" 
    id="list" 
    [ng5-auto-complete]="list" 
    no-record-text="No Records Found!"  />

我也尝试过添加去抖动时间，但它仍然以相同的方式工作。如何在输入第一个字符时完成这项工作？

更多信息：

getCompanyListByLetters(letters: string): Observable<any[]> {
return this.http.get(environment.prodURL + 'v2/company/search/' + letters, this.requestOptions)

  .map((response: Response) => {
    let responseObject = response.json();
    if (responseObject.status == "success" || responseObject.status == "failure") {
      return (
        responseObject.length != 0 ? responseObject as any[] : [{ "BookName": "No Record Found" } as any]
      );
    }
    else {
      throw new Error('Something went wrong ..!!');
    }
  });
}

标签： angularautocomplete