具有延遲功能的輸入觸發器，等待輸入值發生變化

Question

我正在構建一個角度指令，它在輸入值變化時運行一個函數，我想在運行此函數之前等待300ms，但是如果300ms之前走了，我需要重置延遲到300毫秒。所以，只有當300ms的價值變動，則函數應該運行：

我的代碼

(function() { 
    'use strict'; 

    angular 
    .module('address',[]) 
    .directive('address', ['Address', function (Address) { 
     return { 
     restrict: 'E', 
     transclude: true, 
     templateUrl: 'partials/address.html', 
     link: function (scope, elem, attrs) { 
      var delay = "300"; 
      scope.$watch('searchparam', function(){ 
       if(!_.isUndefined(scope.searchparam) && scope.searchparam.length >= 3) { 
        // here i need some delay timer 
        Address.get(scope.searchparam).then(function(data){ 
         console.log("data: ", data); 
         scope.addressList = data; 
        }, function(status){ 
         console.log("status: ", status); 
         scope.errorHandler = status; 
        }); 
       } 
      }); 
     } 
     }; 
    }]); 
})(); 

的address.get是一個異步服務，返回地址

Answer 1

你想要做的就是看什麼到debouncing。它包括在大多數JS庫..而且是standard as of AngularJS 1.3

Answer 2

你需要的東西，如：

var delay = "300"; // not needed, just pointing where to put the rest of the code :) 
var timeout; 
scope.$watch('searchparam', function(){ 
    if(!_.isUndefined(scope.searchparam) && scope.searchparam.length >= 3) { 
     function getAddress() { 
      // do you stuff - Address.get(... 
     } 
     if (timeout) // try to clear the timeout if it was previously set 
      clearTimeout(getAddress); 
     timeout = setTimeout(getAddress, 300); // reset timer 

的