Angular *ngFor - 无法让我的数组循环

Question

这一直在发生错误：找不到类型 'object' 的不同支持对象“[object Object]”。 NgFor 仅支持绑定到 Iterables，例如 Arrays。但是当我尝试将它打印到控制台时它起作用了，感谢大佬们的帮助

谢谢 (:

//TypeScript File :
public names = ["Jimmy" , "Lilly"];
  public ages = [20,25];
  public profile = {
    Name : this.names,
    Age : this.ages
  }

//HTML File :
<div *ngFor = "let i of profile">
    {{i.Name}}
    {{i.Age}}
</div>

Answer 1

错误已经提到了问题所在。

NgFor only supports binding to Iterables such as Arrays

您需要使用数组才能使 *ngFor 正常工作

//TypeScript File
public jimmy = { Name: "Jimmy", Age: 20 };
public lilly = { Name: "Lilly", Age: 25 };
public profiles = [jimmy, lilly]

//HTML File :
<div *ngFor = "let i of profiles">
    {{i.Name}}
    {{i.Age}}
</div>

Answer 2

我不知道我是否确定你想要完成什么，但是绑定 i.Name 是不正确的，因为你将 Name 定义为一个数组。您可以使用 ngFor 遍历 profile.Name，然后绑定属性“名称”。更改变量名称可能会减少混淆:)

<div *ngFor="let i of profile.Name">
{{i.name}}
</div>

同样适用于年龄

Angular *ngFor - Cant get my Arrays to loop