Javascript 输入Angular时进行搜索，以便在服务器不运行时显示准确的结果'；t返回数据的顺序为'；有什么要求吗？

所以我正在为一个客户建立一个网站。在我们的搜索页面上，我正在观察搜索栏，每按一次键都会触发一个新的搜索请求，以便在您键入时更新结果。我的问题是，当我输入一个搜索词时，服务器会“hickup”，并且不会按照我请求的顺序返回结果。这只会导致绑定到返回数据的部分标记显示错误的值。例如如果我输入“视频”这个词。99%的时间我得到了正确的结果，我所有的标签看起来都是正确的。但是，有1%的时间，我搜索“视频”后会返回，这会导致它显示错误的结果和错误的总数。不幸的是，由于保密协议，我无法链接一个实时演示，但我可以发布运行该程序的代码。我们正处于生产的后期阶段，因此尽快使其正常运行比使用最佳实践更为重要。 html的某些部分：

<h1>Search</h1>
                <p ng-cloak class="results-message fade-in">
                  <span ng-if="items.loaded &amp;&amp; term">{{total}} results for "{{term}}"  </span>        
                  <span ng-if="!total &amp;&amp; !term">No query was entered </span>
                  <span ng-if="!items.loaded &amp;&amp; term">Searching...</span>
                </p>
                <div class="search-container">         
                    <input type="search" name="term" value="asd" ng-init="term='asd'" ng-model="term" placeholder="Enter your search term" ng-keydown="$event.keyCode == 13 ? $event.preventDefault() : 0;" class="search">
                    <input type="image" name="submit" src="/_res/astoncarter/img/images/search-icon.gif" alt="Submit">
                </div>
            </div>

<ul ng-cloak ng-class="{loading: loading}" class="results">
               <li ng-if="items.loaded && !items.length && term" class="fade-in">
                    <h2>No results were found for {{term}}</h2>
                </li>
                <li ng-if="!term" class="fade-in">
                    <p class="text-center">Please enter a search query</p>
                </li>
                <li ng-repeat="item in items" class="fade-in">
                    <h2><a href="{{item.url}}">{{item.title}}</a></h2>
                    <p>{{item.teaser}}</p>
                </li>
            </ul>
        </div>
    </div>
</div>
<p ng-if="count == 10" class="load-more"><a href="" ng-if="!loading" ng-click="loadQuery()" class="btn">Load More</a><a href="" ng-if="loading" disabled class="btn"><i class="fa fa-spinner fa-spin"> </i> LOAD</a></p>

它始终显示正确的搜索项，但是它将显示最后返回的{{total}}，并且似乎将最后两次返回的结果附加在一起

---

我只是尝试实现了间隔，以便在一秒钟后在没有用户键入的情况下对结果进行排序“刷新”，但有时服务器可能需要超过1秒的时间，这意味着它仍然会使用错误的信息进行更新。如果你需要我澄清一些事情，请问我任何问题。有时我很难解释我的问题。对格式设置也很抱歉：（

只需返回在结果中搜索的文本。解决承诺后，如果返回的文本不等于当前文本，则返回函数

acAPIservice.getSearch($scope.apiUrl, payload)
  .success(function (data) {
    if (data.term !== $scope.term) {
      return;
    }

    $scope.timer = 3; //reset the timer
    $scope.items = $scope.items.concat(data.results);
    $scope.start = data.start;
    $scope.end = data.end;
    $scope.total = data.total;
    $scope.loading = false;
    $scope.items.loaded = true;
    $scope.count = data.count;
  })
  .error(function(data, status, headers, config){      
    $scope.items = [];
    $scope.items.loaded = true;
  });

---

只需返回在结果中搜索的文本。解决承诺后，如果返回的文本不等于当前文本，则返回函数

acAPIservice.getSearch($scope.apiUrl, payload)
  .success(function (data) {
    if (data.term !== $scope.term) {
      return;
    }

    $scope.timer = 3; //reset the timer
    $scope.items = $scope.items.concat(data.results);
    $scope.start = data.start;
    $scope.end = data.end;
    $scope.total = data.total;
    $scope.loading = false;
    $scope.items.loaded = true;
    $scope.count = data.count;
  })
  .error(function(data, status, headers, config){      
    $scope.items = [];
    $scope.items.loaded = true;
  });

---

要解决搜索结果不成熟的问题，请使用以下方法：

ng-model-options="{ debounce: 1000 }"

---

在本例中，它会延迟将查询发送到1000ms。因此，您将获得“视频”的结果，而不是“视频”

要解决您对不成熟搜索结果的问题，请像这样使用debounce：

ng-model-options="{ debounce: 1000 }"

---

在本例中，它会将查询发送延迟到1000ms。因此，您将获得“视频”而不是“视频”的结果

您是否考虑过使用反盎司？这不会解决问题，但会缓解问题…看！您是否考虑过使用反盎司？这不会解决问题，但会缓解问题…看！这正是我想要的答案。当我更新web服务时，我会向您报告。这正是我想要的答案。我会当我更新我的网络服务时我会报告