AngularJS

Question

假设我有一个输入文本字段（更像是 Google 搜索字段），更改后会触发请求并显示一些结果。

例如，

让我们在输入中输入Dog：

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.

现在，假设 DO 请求比 DOG 请求响应晚。我的模型最终会得到 DO 结果，即使我输入 DOG.

为此，如果我继续输入字符，我需要一种方法来取消或中止当前正在进行的请求。这样，我的模型只会根据最终请求进行更改。

我的输入如下所示：

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

这是我的 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

像这样：$q.reject(response);

尽管从技术上讲我相信上述评论者是正确的，但您实际上是在拒绝承诺而不是真正取消承诺。

Answer 2

对于这种情况，人们通常使用 ng-model-options={debounce: 100}。

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

无论如何你都可以拒绝承诺。

Answer 3

我想你想在这种情况下使用 debounce 技术？

参见：

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

AngularJS - 如何取消承诺？

AngularJS - How to cancel a promise?

javascript

promise

deferred