debounce 不适用于 Angular 中的 keyup 事件

我有一个text box输入一些文本来搜索记录。我在用data-ng-model-options="{ debounce: 1000 }" with keyup event, data-ng-model-options"工作正常，但我想解雇keyup事件之后debounce持续时间。 现在keyup事件在之前立即触发debounce duration。可能是我做错了什么。

这是我的HTML

<input type="text" id="focusOnMe" placeholder="Search..."/ data-ng-keyup="loadSearchResult($event)" data-ng-model="searchText" ng-model-options="{ debounce: 1000 }">

这是我的Keyup event action

$scope.loadSearchResult = function(event) {
  $rootScope.hideSearchResult = true;
  $rootScope.showLoading = true;
  var searchText = $scope.searchText.trim();
  if (searchText.length > 0) {
    $http({
      method: 'POST',
      url: '/secure/search',
      data: {
        searchText: searchText,
        peopleFlag: checkboxValueForPeopleSearch,
        colonyFlag: checkboxValueForColonySearch
      }
    }).success(function(data) {
      console.log(data);
      if (data !== undefined || data !== null) {
        $timeout(function() {
          $rootScope.hideSearchResult = false;
          $rootScope.showLoading = false;

          $scope.allSearchResult = {
            "bookmarks": data.bookmarks,
            "people": data.people,
            "colonies": data.colonies
          };
        }, 300);
      } else {
        $rootScope.showLoading = false;
        commonNotification($rootScope, false, true, true, 'something went wrong!');
        $timeout(function() {
          $rootScope.newStatus = false;

        }, 2000);
      }

    }).error(function(err) {

    });
  } else {
    $rootScope.hideSearchResult = true;
    $rootScope.showLoading = false;
  }

};

抱歉，代码依赖于更多文件，所以我没有plunker example

任何建议都会对我有帮助。

谢谢

Debounce 不会影响 keyup 事件。它只会延迟模型（$scope）变量的分配。因此，您的 keyup 事件会立即触发，并且 loadSearchResult 在您希望之前运行。

要解决这个问题，您可以添加一个与 $scope.searchText 绑定的监视。

$scope.$watch('searchText', function (newValue) {
  loadSearchResult(newValue);
});

超级简单且代码干净，因为我们正在使用单一事实来源 https://en.wikipedia.org/wiki/Single_source_of_truth（$范围）。

注意：我省略了事件对象，因为您没有使用它。