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 ..!!');
    }
  });
}

Angular 5自动完成功能在首次调用时不起作用

0 个答案: