此错误通常是由于尝试将一个非数组或非可迭代对象传递给 *ngFor 指令而导致的。要解决此问题,需要确保 *ngFor 接收到的数据必须是一个数组或可迭代对象,例如一个对象中的属性可以通过 Object.entries() 方法转换为可迭代数组,如下所示:
component.ts 文件中:
data = {
name: 'John',
age: 28,
occupation: 'Developer'
};
get dataEntries() {
return Object.entries(this.data);
}
component.html 文件中:
{{ item[0] }}: {{ item[1] }}
注意,此解决方案中使用了 get 访问器来获取转换为可迭代数组的对象。此外,Object.entries() 方法需要更高版本的 JavaScript(ES2017 / ES8)才能运行。