javascript - 关于过滤器输入和重置索引的 ng-change 的 Material 虚拟重复更新列表？

Question

我已在此 plnkr 中复制了该场景:

<input type="text" ng-model="search.id" ng-change="ctrl.infiniteItems.fetchMoreItems_()">

var vm = this;
  vm.infiniteItems = {
    numLoaded_: 0,
    toLoad_: 0,
    items: [],

    // Required.
    getItemAtIndex: function(index) {
      if (index > this.numLoaded_) {
        this.fetchMoreItems_(index);
        return null;
      }

      return this.items[index];
    },

    // Required.
    getLength: function() {
      return this.numLoaded_ + 3;
    },

    fetchMoreItems_: function(index) {
      if (this.toLoad_ < index) {
        this.toLoad_ += 10;
        var filtered = [];
        fetcher.fetch($scope.search.id).then(angular.bind(this, function(obj) {
          this.items = obj;
          this.numLoaded_ = this.toLoad_;
          if (obj.length <= this.toLoad_) {
            this.items = this.items.concat(obj);
            this.numLoaded_ = this.toLoad_;
          }
        }));
      }
    }
  }

https://plnkr.co/edit/vnrEOmQJ96ZETQpzlaMj

我想在输入值时更新 View ，现在我可以过滤，但只有当我滚动时才得到结果，它从 Controller 调用方法并在顶部显示结果，并且永远不会停止滚动，返回空行一旦结果结束。

我希望它在发生这种情况时停止，就像它在没有过滤器的情况下一样。

Answer 1

这是你想要的吗？ -Plunker

标记

<input type="text" ng-model="search.id" ng-change="inputChange()">

JS

vm.infiniteItems = {
    numLoaded_: 0,
    toLoad_: 0,
    items: [],

    // Required.
    getItemAtIndex: function(index) {
      if (index > this.numLoaded_) {
        this.fetchMoreItems_(index);
        return null;
      }

      return this.items[index];
    },

    // Required.
    getLength: function() {
      return this.numLoaded_ + 3;
    },

    fetchMoreItems_: function(index) {
      if (this.toLoad_ < index) {
        this.toLoad_ += 10;
      }
    }
};

$scope.inputChange = function () {
    console.log($scope.search.id);
     fetcher.fetch($scope.search.id).then(angular.bind(this, function(obj) {
         console.log(obj);
         vm.infiniteItems = obj;
    }));
}