AngularJS typeahead geben [Filter: notarray] Fehler auf Ajax GET-Abfrage

Question

Ich habe eine AngularJS 1.4.7 typeahead:

<input type="text" 
     class="form-control simpleinput" 
     placeholder="keyword" 
     name="searchbarFormInput" 
     id="searchbarFormInput" 
     ng-model="selected" 
     ng-click="selected=null" 
     ng-enter="doBlur($event)" 
     uib-typeahead="record.display_name for record in getRecords($viewValue) | filter:{ display_name : $viewValue }" 
     typeahead-template-url="searchbar-result-template.html" 
     typeahead-on-select="selectRecord($item)" 
     typeahead-focus-on-select="false" 
     typeahead-editable="false" 
     autocomplete="off" /> 

dieses typeahead des Controllers ruft getRecords(needle) und Filter auf der mitgelieferten needle Wert ($viewValue, oder was auch immer Wert in der input Ansicht ist):

$scope.getRecords = function(needle) { 
    return $scope.testRecords; 
} 

Hier ist $scope.testRecords ein Array von Testobjekten, wie zB:

$scope.testRecords = [ { "display_name" : "foo" } , { "display_name" : "bar" } ... ]; 

Dies funktioniert ordnungsgemäß. Die Typehead wird ein Pulldown-Menü darstellen. Das Menü wird basierend auf dem gefiltert, was ich in das Feld input eintippe.

Jetzt möchte ich dieses Array von Datensätzen aus einer GET-Abfrage Quelle:

$scope.getRecords = function(needle) { 
    return $http.get('/search/by', { 
     params: { 
      'requestType' : 'searchByDisplayName', 
      'pageSize' : 1000 
     } 
    }).then(function(res) { 
     console.log(res.data.results); 
     return res.data.results; 
    }); 
} 

Dies ist eine GET-Anforderung an einer Strecke, die, wenn sie direkt aufgerufen arbeitet (bestätigt durch, beispielsweise curl oder wget).

Wenn ich auf die Browser-Konsole gucke, zeigt console.log(res.data.results) das richtige Array von Objekten - genau die gleichen Objekte, die im Array $scope.testObjects sind.

Allerdings bekomme ich kein Pull-Down-Menü und ich erhalte auch die folgenden [filter:notarray] Fehler:

Error: [filter:notarray] http://errors.angularjs.org/1.4.7/filter/notarray?p0=%7B%22%24%24state%22%3A%7B%22status%22%3A0%7D%7D 
https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:6:421 
https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:149:197 
fn 
R@https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap-tpls.min.js:11:6694 
https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap-tpls.min.js:11:8633 
$$parseAndValidate@https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:263:425 
$commitViewValue@https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:263:284 
https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:265:279 
$eval@https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:133:221 
$apply@https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:133:456 
$$debounceViewValueCommit@https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:265:249 
$setViewValue@https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:264:507 
l@https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:163:165 
c@https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:35:221 

Dieser Fehler wiederholt für so viele Briefe wie ich in das input Feld eingeben.

Was mache ich falsch mit dem Request-, Typeahead- oder Typeahead-Filter, und wie kann ich das beheben?

Answer 1

In Ihrem Code, der nicht ein Versprechen Sie Rückkehr funktioniert (das Ergebnis der .then()), nicht das Array:

res.data.results 

Edit: https://github.com/angular-ui/bootstrap/blob/master/src/typeahead/typeahead.js#L219

Erwartet das Ergebnis des Ausdrucks, um ein Array zu ergeben und kein Versprechen. Mit anderen Worten, Sie sollten das change-Ereignis verwenden, um die Funktion auszulösen, die Ihr Array über ein Versprechen aktualisiert, aber der Teil "for record in nameOfAnArray" des Ausdrucks sollte nicht die Funktion sein. Es sollte eine Variable für den $ scope sein. Wenn es sich ändert, sollte es den Digest auslösen und aktualisieren.