AngularJS - Wie man ein Versprechen annulliert?

Question

Angenommen, ich habe ein Eingabefeld (mehr wie das Google-Suchfeld), das bei einer Änderung eine Anfrage auslöst und einige Ergebnisse anzeigt.

Zum Beispiel

Lassen Sie uns Typ in Dog im Eingabe:

typed D -> Calls ctrl.search('D') -> Makes a request -> Changes model when success 
typed DO -> Calls ctrl.search('DO') -> Makes a request -> Changes model when success 
typed DOG -> Calls ctrl.search('DOG') -> Makes a request -> Changes model when success. 

Nun lassen Sie uns sagen, dass die DO Antrag später als die DOG ein reagiert. Mein Modell würde mit den DO Ergebnissen enden, selbst wenn ich DOG eintippte.

Dafür brauche ich eine Möglichkeit, aktuelle laufende Anfragen abzubrechen oder abzubrechen, wenn ich weiter Buchstaben eintippe. Auf diese Weise wird mein Modell nur durch die letzte Anfrage geändert.

sieht meine Eingabe wie folgt aus:

<input type="text" class="form-control" data-ng-model="query" data-ng-change="ctrl.search(query)" placeholder="Search" /> 

Hier ist meine searchCtrl.js:

var search; 
var language; 
var _this; 

var SearchCtrl = function (searchService, lang) 
{ 
    search = searchService; 
    langauge = lang; 
    _this = this; 
} 

SearchCtrl.prototype.search = function (text) 
{ 
    var promise = search.language(language) 
        .facet('characters') 
        .highlight('quotes') 
        .query(text); 

    promise.then(function (response) { 
     if(!response) return; 
     _this.total = response.total; 
     _this.count = response.found; 
     _this.result = response.data; 
    }); 
} 

Answer 1

Normalerweise verwenden in diesem Fall die Leute ng-model-options={debounce: 100}.

https://docs.angularjs.org/api/ng/directive/ngModelOptions

trotzdem können Sie versprechen, ablehnen.

Answer 2

So: $q.reject(response);

Obwohl technisch glaube ich, dass die oben Kommentator, Sie richtig Ich lehne das Versprechen tatsächlich ab und annulliere es nicht wirklich.

Answer 3

Ich denke, dass Sie in diesem Fall eine debounce Technik verwenden möchten?

siehe:

• https://docs.angularjs.org/api/ng/directive/ngModelOptions

• http://ilikekillnerds.com/2014/12/increasing-angular-performance-by-debouncing-your-ng-model-updates/

  <input type="text" 
      class="form-control" 
      data-ng-model="query" 
      data-ng-change="ctrl.search(query)" 
      placeholder="Search" 
      ng-model-options="{ debounce: { 'default': 500, 'blur': 0 } }"  
  />