Question

我正在尝试通过选择复选框进行多次删除，但是当我尝试进行多次删除时，我在控制台中收到错误 Foods.filter不是函数错误。当我在html表中引入管道时，就是出现错误的时候。但没有管道，它工作正常。可能是过滤器没有接收到阵列吗？

HTML

 <tbody>
        <tr *ngFor="let key of Foods | keys; let i = index" >
          <td>{{i + 1}}</td>
          <td><input  #{{Foods[key].id}} [(ngModel)]="Foods[key].selected" type="checkbox"></td>

    </tbody>

组件

delete() {
    this.RemoveFood = this.Foods.filter(Foods => Foods.selected);
    for (var food in this.RemoveFood) {
        this.httpService.deleteFood(this.RemoveFood[food].id)
    }
}

Answer 1

Food似乎是一个Object而不是一个数组，因此没有实现filter方法。

delete() {
    Object.keys(this.Foods) //get an array of the object keys
    .filter(key => this.Foods[key].selected) //filter selected foods
    .forEach(key=>{ //for each food, delete
      let id= this.Foods[key].id;
      this.httpService.deleteFood(id);
    });
}

请注意，逐个删除多种食物可能需要很长时间，也许您应该考虑在服务器上使用批量删除方法。

Foods.filter不是一个函数 - Angular 2

1 个答案: