下拉菜单中未显示物料角度无限滚动

时间:2018-07-23 09:38:41

标签: javascript angularjs angular-material

我有以下内容。

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_ + 5;
  },

  fetchMoreItems_: function(index) {
    if (this.toLoad_ < index) {
      this.toLoad_ += 5;
      WafersFactory.get().success(angular.bind(this, function(obj) {
        this.items = this.items.concat(obj.success);
        console.log(this.items);
        this.numLoaded_ = this.toLoad_;
      }));
    }
  }
};

$scope.mdSelectOnOpen = function() {
  return $timeout(function() {
    $scope.$broadcast("$md-resize");
    window.dispatchEvent(new Event('resize'));
  }, 100);
}

和这样的HTML:

<md-input-container class="md-block" ng-controller="WafersCtrl as ctrl" flex-gt-sm>
  <label>Wafer</label>
  <md-select ng-model="ctrl.data.wafer_id" placeholder="Wafer" md-on-open="mdSelectOnOpen()">
    <md-virtual-repeat-container id="vertical-container">
      <md-option md-virtual-repeat="item in ctrl.infiniteItems" md-on-demand class="repeated-item" ng-value="item.id" flex>{{item.serial_number}}</md-option>
    </md-virtual-repeat-container>
    <div ng-hide="ctrl.infiniteItems.length">No items found</div>
  </md-select>
</md-input-container>

什么都没有出现。

enter image description here

做了一些研究,提到了相关问题here

我使用angularjs 1.4.7时将其更新为1.5.7,最新的angular-material仍然遇到相同的问题。我还尝试将材料版本降级为1.0.0-rc1。似乎没有任何作用。您看到的console.log在我的控制台中吐出了以下内容。

enter image description here

0 个答案:

没有答案