Topic: Angular Autocomplete Remote Data Issue
Jazzguitar68 free asked 5 years ago
Hey Folks,
I just started working with Angular not too long ago and recently purchased a pro license here. When trying to get the Autocomplete control to use remote data from an Oracle ORDS API I get the error "You provided 'null' where a stream was expected. You can provide an Observable, Promise, Array or Iterable". The only difference between success and fail is the change of URL to the individual APIs.
When looking at the APIs through Postman I see the following returns.
Data Return from sample API:
[{
"name": "Afghanistan",
"code": "AF",
"flag": "demo/res/img/af.png"
},
Data Return from Oracle ORD:
{
"items": [
{
"customer_id": 568451,
"name": "<Customer Name>"
},
Any help would be much appreciated.
Thanks,
Wayne
Damian Gemza staff answered 5 years ago
Dear Wayne,
I see two possible ways of resolving your problem.
1st: Get data from the backend, and save it in some variable, and then use completerService.local instead of remote to autocomplete through your data.
Here's the code which you can use in this approach:
protected searchStr: string;
protected dataService: CompleterData;
protected searchData = [];
constructor(public completerService: CompleterService, private http: HttpClient) {
this.http.get('https://restcountries.eu/rest/v2/all').subscribe((data: any) => {
this.searchData = data;
this.dataService = completerService.local(this.searchData, 'name', 'name');
});
}
2nd: In the next release of MDB Angular we'll publish a new version of Auto Completer component. So you could use it after update to MDB Angular 7.2.0
Best Regards,
Damian
Jazzguitar68 free commented 5 years ago
Hey Damian,
Thank you so much for the quick response. Quick question for you. Are you importing '@angular/common/http' or '@angular/http'??
Wayne
Damian Gemza staff commented 5 years ago
Dear @Jazzguitar68
I'm using @angular/common/http module, because @angular/http is deprecated.
Best Regards,
Damian
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 7.0.0
- Device: Surface Book 2
- Browser: Chrome
- OS: Win10
- Provided sample code: No
- Provided link: No