AngularJS - Làm cách nào để hủy lời hứa?

Question

Giả sử tôi có trường nhập văn bản (giống như trường tìm kiếm của Google), khi được thay đổi, sẽ kích hoạt yêu cầu và hiển thị một số kết quả.

Ví dụ,

Hãy gõ Dog trong đầu vào:

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. 

Bây giờ, chúng ta hãy nói rằng yêu cầu DO phản ứng muộn hơn DOG một. Mô hình của tôi sẽ kết thúc với kết quả DO, ngay cả khi tôi đã nhập DOG.

Đối với điều đó, tôi cần một cách để hủy hoặc hủy các yêu cầu hiện tại đang diễn ra nếu tôi tiếp tục nhập các ký tự. Bằng cách đó, mô hình của tôi chỉ thay đổi theo yêu cầu cuối cùng.

đầu vào của tôi trông giống như sau:

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

Đây là tôi 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

Thông thường đối với trường hợp này, mọi người sử dụng ng-model-options={debounce: 100}.

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

bạn có thể từ chối lời hứa.

Answer 2

Như thế này: $q.reject(response);

Mặc dù về mặt kỹ thuật Tôi tin rằng commenter trên là chính xác, bạn thực sự từ chối lời hứa và không thực sự hủy lời hứa.

Answer 3

Tôi nghĩ bạn muốn sử dụng kỹ thuật debounce trong trường hợp này?

see:

• 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 } }"  
  />