material 关于过滤器输入和重置索引的 ng 更改的虚拟重复更新列表?

material virtual-repeat update list on ng-change of filter input and reset index?

我已经在这个 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

我想在输入值时更新视图,现在我可以过滤,但只有当我滚动时我才能得到结果,它从控制器调用方法并在顶部显示结果并且永远不会停止滚动,returns 结果结束后,空行。

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

这是你想要的吗? - 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;
    }));
}