Having an issue with ngBootstraps typeahead and async http requests.
This is what I have
example.html
<input id="typeahead-basic" type="text" class="form-control" value="{{issue.Series.Title}}" (selectItem)="selectSeries($event)" [ngbTypeahead]="searchSeries" [resultFormatter]="seriesFormatter"/>
example.ts
searchSeries = (text$: Observable<string>) =>
text$
.debounceTime(100)
.distinctUntilChanged()
.map(async term => {
return await this.service.getSeries(term);
});
example.servics.ts
async getSeries(term: string): Promise<Series[]> {
let series: Series = new Series();
series.Title = term;
let headers = new Headers();
headers.append('Content-Type', 'application/json');
let options = new RequestOptions({headers: headers});
return await this.http.post(this.urlSeries, JSON.stringify(series), options)
.map(res => res.json() || {})
.catch(res => Observable.throw("error"))
.toPromise();
}
Encountering an error every time I start typing in the input field.
NgbTypeaheadWindow.html:5 ERROR Error: Cannot find a differ supporting object '[object Promise]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.
at NgForOf.webpackJsonp.../../../common/@angular/common.es5.js.NgForOf.ngOnChanges (common.es5.js:1659)
at checkAndUpdateDirectiveInline (core.es5.js:10891)
at checkAndUpdateNodeInline (core.es5.js:12382)
at checkAndUpdateNode (core.es5.js:12321)
at debugCheckAndUpdateNode (core.es5.js:13180)
at debugCheckDirectivesFn (core.es5.js:13121)
at Object.eval [as updateDirectives] (NgbTypeaheadWindow.html:5)
at Object.debugUpdateDirectives [as updateDirectives] (core.es5.js:13106)
at checkAndUpdateView (core.es5.js:12288)
at callViewAction (core.es5.js:12651)
The error message suggests that ngFor requires an Array, but my searchSeries function does return an array. When I modify searchSeries to
searchSeries = (text$: Observable<string>) =>
text$
.debounceTime(100)
.distinctUntilChanged()
.map(async term => {
let result = await this.service.getSeries(term);
console.log(result);
return result;
});
I can confirm that result is an array. So why am I still seeing this error message?
Appreciate any help!