How can I add autocomplete/typeahead feature to my ionic app through $http

ionic-v1
1

I tried bootstrap UI and ion-autocomplete but they didn’t work well. Can someone suggest how can I add autocomplete/typeahead feature to my app through $http promise.

2

please define, otherwise it will be hard to help you with a better solution.

1 Like
3

there is no error in the console and data is also returning in success function but its not getting bind to the typeahead of UI bootstarp/ ion-autocomplete I have tried both. But when I try to return static data the autocomplete is working properly.

4

So after you get the data everything is identical, but one time it gets renedered and one time not? Sounds like an async problem somehow. Some promise you should wait for to trigger before you do something else?

5

I am trying to use bootstrap Ui typeahead and ion-autocomplete for auto populate of text through $http service I am attaching the sample code for both.

Bootstrap UI Code:

$scope.autocomplete = function(query){

		searchAutocompleteService.autoComplete(query).
			then(
					function(result){
						$scope.Categories = result.data;
					},
					function(error){
						
					}
				)

	}


<input type="text" placeholder="Search" ng-model="searchText" ng-keydown="autocomplete(searchText)" uib-typeahead="state for state in Categories" typeahead-no-results="noResults">

ion-autocomplete code:

$scope.callbackMethod = function (query, isInitializing) {
searchAutocompleteService.autoComplete(query).
		then(
				function(result){
					return result.data;
				},
				function(error){
  return result.error;
				}
			)

}

<input ion-autocomplete type="text" ng-model="searchText" readonly="readonly" class="ion autocomplete" autocomplete="off" items-method="callbackMethod(query)"  items-method-valuekey="items" item-value-key="name" item-view-value-key="names" max-selected-items="1" />