4

我从这里有以下输入字段代码片段我正在$scope以下列方式调用 AngularJS 方法

<input class="search-txt-input"
       id="partner_name"
       name="partner_name"
       title="Partner Name"
       type="text"
       autocomplete="off"
       ng-model="selectedPartner"
       typeahead="partner as partner.name for partner in retrievePartnerList($viewValue)"
       typeahead-items="2"
       typeahead-min-length="3">

因此,当我在文本字段中输入至少 3 个字符时,它会触发 AJAX 调用以调用retrievePartnerList函数。

我的服务器响应也很慢,所以对于 10 个字符,有 7 个 Ajax 调用进入队列,一段时间后我收到了 TimeOutError。

所以为了解决这个问题,我试图找到一种方法来延迟对retrievePartnerList()方法的调用,以便发送更少的 AJAX 调用,并可能减轻我的服务器的负担。

所以我不确定如何setTimeout()在这里使用函数。

让我知道你们中是否有人对此有任何想法。

4

2 回答 2

13

typeahead-wait-ms是的,您可以通过指定属性轻松延迟触发匹配。正如该属性的名称所暗示的,它以毫秒为单位取一个值,并将延迟匹配,在用户停止输入后等待指定的毫秒数,然后再向服务器发出请求。

这是一个演示,展示了这一点: http: //plnkr.co/edit/fHLqDx ?p=preview

于 2013-08-12T11:44:53.400 回答
2

检查AngularStrap解决方案:https ://github.com/mgcrea/angular-strap/blob/master/src/directives/typeahead.js

或者

在javascript中可以很容易地做到这一点:

var autocomplete = $('#searchinput').typeahead().on('keyup', delayRequest);

function dataRequest() {
    // api request here
}

function delayRequest(event) {
    if(delayRequest.timeout) {
        clearTimeout(delayRequest.timeout);
    }

    var target = this;

    delayRequest.timeout = setTimeout(function() {
        dataRequest.call(target, event);
    }, 200); // 200ms delay
}
于 2013-08-12T10:41:44.947 回答