You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I'm using the autocomplete and the data it's displaying comes from a 3rd party API.
The issue I'm having is that when the first query runs it doesn't display anything and it just shows the NotFound message.
And in other cases, show Not Found message all times (and i checked that data var is filled)
So, I have the minQueryLength set to 3. When you start writing and hit the 3rd character we call a function that makes a 3rd party API call and returns the values. While all this is happening the input is set to loading, when the data comes back and it's ready to be used we set the input to not loading.
Even tho we have the data (in the correct format) the input will display the not found message, at this point if I press any button that doesn't modify the string (left arrow, right arrow, etc) it makes the query again and this time it displays the right information.
I cannot reply exactly in stackblitz, but the error is similar, since data is loaded in the variable, but autocomplete show non items template
To reproduce, you can use this function
onChangeSearch(event: any): void {
console.log('onChangeSearch');
this.loadingAutocomplete = true;
console.log(event);
this.autocomplete = [];
this.http
.get( https://fmpcloud.io/api/v3/search?query=${event}&limit=10&apikey=fec2976652d9896caec33a4c64bf1a69
)
.subscribe((data: any) => {
data.forEach((element) => {
this.autocomplete.push({
name: element.name,
});
});
setTimeout(() => {
console.log(this.autocomplete);
this.loadingAutocomplete = false;
}, 100);
});
}
And this html
<ng-autocomplete
[data]="autocomplete"
[searchKeyword]="'name'"
(inputChanged)="onChangeSearch($event)"
[itemTemplate]="itemTemplate"
[isLoading]="loadingAutocomplete"
[notFoundTemplate]="notFoundTemplate"
[minQueryLength]="3"
Name: {{ item.name }}
<ng-template #notFoundTemplate let-notFound>
The text was updated successfully, but these errors were encountered:
To reopen this other bug
#83
I'm using the autocomplete and the data it's displaying comes from a 3rd party API.
The issue I'm having is that when the first query runs it doesn't display anything and it just shows the NotFound message.
And in other cases, show Not Found message all times (and i checked that data var is filled)
So, I have the minQueryLength set to 3. When you start writing and hit the 3rd character we call a function that makes a 3rd party API call and returns the values. While all this is happening the input is set to loading, when the data comes back and it's ready to be used we set the input to not loading.
Even tho we have the data (in the correct format) the input will display the not found message, at this point if I press any button that doesn't modify the string (left arrow, right arrow, etc) it makes the query again and this time it displays the right information.
I cannot reply exactly in stackblitz, but the error is similar, since data is loaded in the variable, but autocomplete show non items template
https://stackblitz.com/edit/angular13-validation-rqxgbb
To reproduce, you can use this function
onChangeSearch(event: any): void {
console.log('onChangeSearch');
this.loadingAutocomplete = true;
console.log(event);
this.autocomplete = [];
this.http
.get(
https://fmpcloud.io/api/v3/search?query=${event}&limit=10&apikey=fec2976652d9896caec33a4c64bf1a69
)
.subscribe((data: any) => {
data.forEach((element) => {
this.autocomplete.push({
name: element.name,
});
});
setTimeout(() => {
console.log(this.autocomplete);
this.loadingAutocomplete = false;
}, 100);
});
}
And this html
<ng-autocomplete
[data]="autocomplete"
[searchKeyword]="'name'"
(inputChanged)="onChangeSearch($event)"
[itemTemplate]="itemTemplate"
[isLoading]="loadingAutocomplete"
[notFoundTemplate]="notFoundTemplate"
[minQueryLength]="3"
Name: {{ item.name }}
<ng-template #notFoundTemplate let-notFound>
The text was updated successfully, but these errors were encountered: