Question

我从firebase读取对象数组，并检查是否有重复项并计算重复项的数量。之后，我创建一个新的对象，该对象显示重复项的数量及其名称。

我从firebase读取的数据：

a {
  name: "sweet potato",
  color: "orange"
}
b {
  name: "sweet potato",
  color: "orange"
}
c {
  name: "eggplant",
  color: "purple"
}

过滤后的数据：

a {
  name: "potato",
  count: 2
}
b {
  name: "eggplant",
  count: 1
}

打字稿代码：

constructor(private firebaseService:FirebaseService) { }

ngOnInit() {
  this.firebaseService.getData("/name").subscribe(name => {
    this.names=name;
    this.updateMain();
  }) 
}

duplicateFilter() {       // Here we Detect Duplicate
  this.total = [];
  var newArr = [],
      origLen = this.names.length,
      found, x, y;

  for (x = 0; x < origLen; x++) {
    found = undefined;
    for (y = 0; y < newArr.length; y++) {
      if (this.names[x].name === newArr[y]) {
        found = true;
        break;
      }
    }
    if (!found) {
      newArr.push(this.names[x].name);
    }
  }
  return newArr;
}

elementFilter(food) {
  for (var num = 0, i = 0; i < this.names.length; i++) {
    if (this.names[i].name == food) {
      num = num + 1;
    }
  }
  this.total.push(num);
}

objectCreate() {
  this.modal = [];
  for(var i = 0; i < this.newArr.length; i++) {
    this.modal.push({
      name: this.newArr[i],
      count: this.total[i],
    })
  }
}

updateMain() {
  this.newArr = this.duplicateFilter();

  for (let i in this.newArr) {
    this.elementFilter(this.newArr[i]);
  }
  this.objectCreate();
}

HTML代码：

<div *ngFor="let modal of modal>
  <div class="center">{{modal.name}}</div>
  <div class="center">{{modal.count}}</div>
</div>

问题在于即使我发送更新已过滤的对象，信息也不会因任何更改（添加或编辑）而更新。它只是显示相同的信息。我可以用其他方式强制ngFor渲染吗？

Answer 1

您没有定义新变量。尝试使用@Override public void onBackPressed() { super.onBackPressed(); }，或更可取的是尝试使用<div *ngFor="let m of modal>，并将变量名称更新为<div *ngFor="let modal of modals>。

如何强制ngFor渲染

1 个答案: