Angularjs bootstrap typeahead not working: Error: [filter: notarray]

Question

I need to get hints using typeahead by making an http call

$scope.getlist = function getListofNames(name) {
 return $http({
   method: 'GET',
     url: '/v1/'+name,
     data: ""
 }).then(function(response){

     if(response.data.statusMessage !== 'SUCCESS'){
         response.errorMessage = "Error while processing request. Please retry."
           return response;
     }

         else {
           return response.data.payload;
         }

       }, function(response){
       response.errorMessage = "Error while processing request"
           return response;
       }
       );
}

response.data.payload is an array of objects, it is retrieved successfully, but I get this error Error: [filter: notarray] http://errors.angularjs.org/1.4.5/filter/notarray ?

Note. I am using angular 1.4.5 and Bootstrap v3.1.1

Answer 1

I assume your typeahead markup looks like this:

<input [...] typeahead="item in getItems($viewValue) | filter: $viewValue">

Why does it not work:

, . getItems getListofNames, - $http. getListofNames() - , .

:

. , getItems. . , , ( $viewValue), . . , :

$scope.getList = function getListofNames(name) {
    return $http(...}).then(
        function(response){
            // filter response.data.payload according to 
            // the 'name' ($viewValue) substring entered by the user
            return filteredArray; // <- no need to pipe a filter in the template anymore
        }
    );
};