Angular 5 autocomplete не работает при первом вызове - PullRequest
Новая
       7

Angular 5 autocomplete не работает при первом вызове

0 голосов
/ 29 августа 2018

Я использую библиотеку 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 и отображал их в списке. Но проблема в том, что список не появляется для первого символа. Он отлично работает, когда набирается больше символов.

Например: когда я перезагружаю страницу и набираю «а», то отображается «записи не найдены». И когда я продолжу печатать, как «аа», то он покажет мне предложения от API. Теперь, когда я нажимаю клавишу возврата, ввод снова становится «а», на этот раз отображаются предложения.

Это мой код внутри 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 ..!!');
    }
  });
}
...