Angular *ngFor – Cant get my Arrays to loop

This keeps kicking upError: Cannot find a differ supporting object ‘[object Object]’ of type ‘object’. NgFor only supports binding to Iterables such as Arrays. But it works when I try print it to the console, any help be appreciated big time guys

Thank you (:

//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

The error already mentions what’s the issue.

NgFor only supports binding to Iterables such as Arrays

You need to use an array in order that *ngFor works

//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>