*ngFor 循环遍历 mLab 对象即使在声明数组后尝试 diff'[object Object] 也会产生错误

Question

我的 TS 文件中有一个声明为 carousels: any = [] 的数组，但每当我使用 *ngFor 循环它时，我总是收到一个错误，指出 'only arrays and iterables allowed'。该数组中的数据是从 mLab 获取的。

我的代码的目标是使用它的 id 从 mLab 更新一个对象，这似乎工作正常。但是每当我按下更新时，即使更新有效，为什么我仍然会收到错误消息？

我曾尝试将 carousels: any = [] 更改为 carousels = []，但它似乎没有任何改变。

这是我的代码。

api.js（后端） - 这是与数据库通信的代码。

router.route('carousel/update/:_id).put(function(req, res) {

db.collection('home').updateOne({"_id": ObjectId(req.params._id)}, {$set: req.body}, (err, results) => {
if (err) throw err;
res.send(results)
console.log(req.params._id)
});
});

home.service.ts

return this.http.put<any[]>('./api/carousel/update/' + id, {'header': newheader, 'subheader': newsubheader})
}

component.ts

声明：

carousels: any = [];

更新函数：

updateSlide(id: number){
this.HomeService.updateSlide(id, this.header, this.subheader).subscribe(slides => {this.carousels = slides})
}

更新有效，但我仍然收到错误：尝试比较“[object object]”时出错。只允许数组和迭代器

Answer 1

.updateOne({}) 不是 return 对象列表，而是包含更新行信息的对象。

您正在 return 从 API 获取该对象，然后将其设置在组件的 updateSlider() 中，您应该在其中设置一个数组。

尝试在订阅中记录结果或api或幻灯片，您应该可以看到问题。

Answer 2

经过多次阅读和 post 之后，我发现我的错误是我在组件文件中手动订阅了 Observable。

手动更新如下所示：

.subscribe(slides => {this.carousels = slides})

事实证明，这已经自动完成，因此我不需要再次手动完成。参考这个post：

这解决了我的问题。

*ngFor 循环遍历 mLab 对象即使在声明数组后尝试 diff'[object Object] 也会产生错误

*ngFor loop over mLab objects produce Error trying to diff'[object Object] even after declaring array

node.js

mlab

angular