I am currently working with an API service:
var SearchSuggestionApi = function (Restangular) {
return {
getSuggestion: function (keyword) {
return Restangular.one('search').customGET(null, {keyword:keyword});
}
};
};
SearchSuggestionApi.$inject = [
'Restangular'
];
In order to call this API, I have created a controller:
vm.getSuggestion = function (keyword) {
SearchSuggestionApi.getSuggestion(keyword)
.then(
function (data) {
vm.listData = data;
}, function (error) {
console.log(error);
});
};
My issue arises when I make multiple calls to vm.getSuggestion(keyword), specifically more than once. For example:
vm.getSuggestion('a'); // => Returns an array with multiple objectsvm.getSuggestion('a b');// => Returns an empty arraySince vm.getSuggestion('a') returns a lot of data, it completes after vm.getSuggestion('a b'). This results in vm.listData containing [{object1}, {object2}, ...], but I want vm.listData to be [] (the response data from the last function).
Is there a way to cancel pending API calls in the first function when calling the second function, or any other methods to get the last response data and set it for vm.listData?
I have looked into some articles about cancelling pending API calls, but they did not provide a solution to my specific problem.
Thank you for your assistance :)