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 文字を入力すると、retrievePartnerList関数への AJAX 呼び出しが起動されます。

また、サーバーの応答が非常に遅いため、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 に答える