Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/21.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 角度材质虚拟重复(按需)将第一批加载的项目重复两次_Javascript_Angularjs_Material Design_Ng Repeat_Angular Material - Fatal编程技术网

Javascript 角度材质虚拟重复(按需)将第一批加载的项目重复两次

Javascript 角度材质虚拟重复(按需)将第一批加载的项目重复两次,javascript,angularjs,material-design,ng-repeat,angular-material,Javascript,Angularjs,Material Design,Ng Repeat,Angular Material,我正在处理Angular(版本1.4.9)材质,并对示例代码进行了轻微修改 我的代码从REST资源每页加载15个项目,并在列表中显示它们。 但是我的列表显示了前15项,然后重复前15项(错误!)然后加载下一组项目(16到30项,以此类推)。我找不到问题,你知道为什么会这样吗 html文件中的代码: <div class="virtualRepeat"> <md-virtual-repeat-container id="vertical-container"> <

我正在处理Angular(版本1.4.9)材质,并对示例代码进行了轻微修改

我的代码从REST资源每页加载15个项目,并在列表中显示它们。 但是我的列表显示了前15项,然后重复前15项(错误!)然后加载下一组项目(16到30项,以此类推)。我找不到问题,你知道为什么会这样吗

html文件中的代码:

<div class="virtualRepeat">
<md-virtual-repeat-container id="vertical-container">
  <md-list>
    <md-list-item md-virtual-repeat="user in listCtrl.userData" md-on-demand class="md-2-line" flex>
      <div class="md-list-item-text">
        Name: {{user.name}}
        ID: {{user.id}}
      </div>
    </md-list-item>
  </md-list>
</md-virtual-repeat-container>
</div>

名称:{{user.Name}
ID:{{user.ID}
来自控制器的代码:

...
var vm = this;

var ListItems = function() {
  this.count = 0;
  this.pageSize = 15;
  this.loadedPages = {};
  this.listData = [];
  this.getUserCount_();
}

ListItems.prototype.getItemAtIndex = function(index) {
  var currentPage = Math.floor(index / this.pageSize);
  var page = this.loadedPages[currentPage];
  if (page) {
    return this.listData[index];
  } else if (page !== null) {
    this.getPage_(currentPage);
  }
}

ListItems.prototype.getLength = function() {
  return this.count;
}

ListItems.prototype.getPage_ = function(currentPage) {
  this.loadedPages[currentPage] = null; 
  this.loadedPages[currentPage] = [];

  var pageOffset = currentPage * this.pageSize;

  for (var i = pageOffset; i < pageOffset + this.pageSize; i++) {
    this.loadedPages[currentPage].push(i);
  }

  RestFactory.fetchCurrentPage(currentPage).then(angular.bind(this, function(users) {
    for(var i = 0; i < users.items.length; i++) {
      this.listData.push({
        name: users.items[i].name,
        id: users.items[i].id
      });
    }
  }));

}

ListItems.prototype.getUserCount_ = function() {
  RestFactory.fetchUserCount().then(angular.bind(this, function(count) {
    this.userCount = count;
  }));
}

vm.userData = new ListItems();
...
。。。
var vm=这个;
var ListItems=函数(){
此值为0.count;
这个.pageSize=15;
this.loadedPages={};
this.listData=[];
这是.getUserCount_389;();
}
ListItems.prototype.getItemAtIndex=函数(索引){
var currentPage=Math.floor(索引/this.pageSize);
var page=this.loadedPages[currentPage];
若有(第页){
返回此.listData[index];
}else if(第!==null页){
此.getPage_u2;(当前页);
}
}
ListItems.prototype.getLength=函数(){
返回这个.count;
}
ListItems.prototype.getPage=函数(currentPage){
this.loadedPages[currentPage]=null;
此.loadedPages[currentPage]=[];
var pageOffset=currentPage*this.pageSize;
对于(变量i=pageOffset;i
在代码中发现问题是很重要的。你能为你的代码做一个演示吗?例如,通过修改初始行,我无法在代码上重现这种奇怪的行为。这可能意味着在代码的其他部分重复前15行的原因。您可以尝试完全刷新该部件/模块,并从完全复制自虚拟重复文档的代码开始。感谢您尝试@shershen,问题解决了。为fetchCurrentPage()提供另一个参数