0

我最近在我的homepage.html使用中添加了一个简单的删除按钮：

<button style="border: 1.5px solid rgba(255, 0, 0, 0.226); background- 
color: whitesmoke; border-radius: 23px; font-size: 15px; padding: 5px; 
margin: 5px;"
(click)="removeCat(cat._id)">Delete</button>

我收到控制台错误：

HomePageComponent.html:96 ERROR 错误：尝试比较“[object Object]”时出错。只允许使用数组和可迭代对象

有人告诉我这是在我的 html 的第 96 行，就是这一行

<tr *ngFor="let cat of cats">
<td>{{cat.breedname}}</td>
<td>{{cat.age}}</td>
<td>{{cat.gender}}</td>
<td>{{cat.comfortablecatdog}}</td>
<td>{{cat.comfortablekids}}</td>
<td>{{cat.health}}</td>
<button
  style="border: 1.5px solid rgba(0, 164, 240, 0.267); background-color: whitesmoke; border-radius: 23px; font-size: 15px; padding: 5px; margin: 5px;"
      [routerLink]="['/cats', cat._id]">Details</button>
    <button
      style="border: 1.5px solid rgba(255, 217, 0, 0.267); background-color: whitesmoke; border-radius: 23px; font-size: 15px; padding: 5px; margin: 5px;"
      [routerLink]="['/cats', cat._id, 'edit']">Edit</button>
    <button style="border: 1.5px solid rgba(255, 0, 0, 0.226); background-color: whitesmoke; border-radius: 23px; font-size: 15px; padding: 5px; margin: 5px;"
    (click)="removeCat(cat._id)">Delete</button>
  </tr>

这是我的homepage.ts：

removeCat(_id) {
var tempObeservable = this._httpService.removeCatById(_id);
tempObeservable.subscribe((data: any) => {
  console.log('got a response from delete');
  var tempObeservable = this._httpService.getAllPets();
  tempObeservable.subscribe((data: any) => {
    console.log('got a response from ngoninit', data);
    this.cats = data;
  })
})

}

这是我的 http.service.ts

    removeCatById(_id){
    console.log('deleteDog', _id);
    return this._http.delete(`/api/pets/${_id}/deletecat`, _id);
  }

这是我的 app-routing.module.ts

    {path: 'cats/:id/deletecat', component: HomePageComponent},

这是我的 routers.js

      app.delete('/api/pets/:id/deletecat', pets.deleteCat);

这是我的 pets.js 控制器

      deleteCat: (req, res) => {
        Cat.deleteOne({ _id: req.params.id }, function (err) {
            if (err) {
                console.log("hit delete but got errors", err);
                res.json(err);
            } else {
                res.json({ message: 'succesfully deleted' });
            }
        })
    }

我的其他按钮工作正常，“编辑”和“详细信息”，但是这些按钮使用的是 [routerLink] 而不是我的（单击）功能。我在网上找到的答案似乎都没有帮助。如果我没有提供足够的代码，我很乐意提供更多代码。

谢谢你。

[编辑] 我应该提到该按钮仍将删除正确的对象，但仅在我刷新页面后显示。

4

0 回答 0