NgbTypeahead on multiple inputs in a component

659 Views Asked by At

Does anybody know how to use ngbtypeahead functionality on multiple inputs in a component? I have a simple customer form and want users to be able to search by last name when they type in last name field or by first name when they type in that field. I can get it to work for both fields with different search methods returning results correctly, but when you select in one, it will blank the other field out. Meaning, I select from the last name popup, it puts the correct last name in the field, but then the first name field is clear and vice versa. Even trying to trap and manually set in the selectItem, it sets it and then immediately gets cleared. Like somehow they are bound to a single backend "object".
I'm new to Angular8 and this ngbtypeahead functionality, so I apologize in advance if this is a simple newbie deal. Thanks much for any info you've got.

custFullNameSearch = (text$: Observable < string > ) =>
  text$.pipe(
    debounceTime(300),
    distinctUntilChanged(),
    switchMap(nameval =>
      this.customerService.getCustomersByFullNameorPhoneSearch(nameval).pipe(
        tap(() => this.searchFailed = false),
        catchError(() => {
          this.searchFailed = true;
          return of([]);
        }))
    )
  )

custFirstNameSearch = (xtext$: Observable < string > ) =>
  xtext$.pipe(
    debounceTime(300),
    distinctUntilChanged(),
    switchMap(fnameval =>
      this.customerService.getCustomersByFirstNameSearch(fnameval).pipe(
        tap(() => this.searchFailed = false),
        catchError(() => {
          this.searchFailed = true;
          return of([]);
        }))
    )
  )

enter image description here

0

There are 0 best solutions below