Cannot read property 'pipe' of undefined at TagInputDropdown.getItemsFromObservable

[bigyanchap]

I'm submitting a ...

[x] support request/question

Current behavior

I get following error while tags were observed:

core.js:6210 ERROR TypeError: Cannot read property 'pipe' of undefined
    at TagInputDropdown.getItemsFromObservable (ngx-chips.js:1200)
    at SafeSubscriber.TagInputDropdown.show [as _next] (ngx-chips.js:1151)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:183)
    at SafeSubscriber.next (Subscriber.js:122)
    at Subscriber._next (Subscriber.js:72)
    at Subscriber.next (Subscriber.js:49)
    at FilterSubscriber._next (filter.js:33)
    at FilterSubscriber.next (Subscriber.js:49)
    at DebounceTimeSubscriber.debouncedNext (debounceTime.js:40)
    at AsyncAction.dispatchNext (debounceTime.js:53)

Expected behavior

Display Tags in a dropdown

Minimal reproduction of the problem with instructions (if applicable)

---html---

<form [formGroup]="categoryForm">
  <div class="force-to-the-bottom">
    <tag-input formControlName="myCategories" [onlyFromAutocomplete]="true">
      <tag-input-dropdown [autocompleteObservable]="requestCategories">
      </tag-input-dropdown>
    </tag-input>
  </div>
</form>

--- component ---

public requestCategories = (text: string) => {
    this.categoryService.getCategoriesBySubStr({ word: text });
};

--- category.service.ts ---

getCategoriesBySubStr(data): Observable<any> {
    return this.apiService.post('Category/getBySubStr', data);
}

--- api.service.ts ---

post(path: string, body: Object = {}): Observable<any> {
    return this.http.post(
      `${environment.apiUrl}${path}`,
      body
    ).pipe(
      tap((res) => this.postReutnData(res)),
      catchError((err) => this.postPutFormatErrors(err))
    );
  };

Built the app using:

angular CLI

Angular version:

Angular v8

ngx-chips version:

2.1.0

Browser: Chrome XX

[Gbuomprisco]

public requestCategories = (text: string) => {
    this.categoryService.getCategoriesBySubStr({ word: text });
};

You're not returning the Obervable?

[bigyanchap]

I am not sure, I understood what you asked. I hope this satisfies your question:

1. My apiService is doing the return job.
2. I tried to subscribe after .getCategoriesBySubStr({ word: text }) but it gave me error. Then, I guessed, it is the library which subscribes to the List<DisplayValueDTO> that comes from server side. where, DisplayValueDTO is...

   public class DisplayValueDTO
   {
       public Int64 Value { get; set; }
       public string Display { get; set; }
   }

[Gbuomprisco]

If you don't return an Observable, your function is void:

public requestCategories = (text: string) => {
 return this.categoryService.getCategoriesBySubStr({ word: text });
};

[bigyanchap]

Thank you Gbumprisco. I see what I missed. Now it's working like charm.