typescript - Angular 7 ngFor ทำซ้ำผ่านอาร์เรย์ของอ็อบเจ็กต์

ฉันไม่สามารถวนซ้ำผ่านอาร์เรย์ของอ็อบเจ็กต์ได้ ในแต่ละอ็อบเจ็กต์ ฉันมีชื่อ แต่ฉันไม่สามารถดึงข้อความของอ็อบเจ็กต์หรือชื่อภายในได้

ฉันมีโค้ดดังต่อไปนี้ในไฟล์ ts ของฉัน

retrieveMultiple(config, "accounts")
.then(
    (results) => {
        const accounts: any[] = [];
        for (let record of results.value) {
            accounts.push(record);
        }

        this.accounts= accounts;
        console.log(accounts[0].name);
        console.log(accounts);
    },
    (error) => {
        console.log(error);
    }

และฉันมีสิ่งนี้ในไฟล์ HTML ของฉัน:

      <p>Accounts:</p>
  <ul>
    <li *ngFor="let account of accounts | json">
      {{ account.name }}
    </li>
  </ul>

คำตอบ #1

คุณไม่ควรมีท่อ json ในนิพจน์ลูปของคุณ เปลี่ยนโค้ดเอาต์พุตของคุณเป็นดังนี้:

<p>Accounts:</p>
<ul>
  <li *ngFor="let account of accounts">
    {{ account.name }}
  </li>
</ul>

หรือสำหรับการดีบักคุณสามารถใช้สิ่งนี้:

<p>Accounts:</p>
<ul>
  <li *ngFor="let account of accounts">
    {{ account | json }}
  </li>
</ul>

คำตอบ #2

https://angular.io/api/common/NgForOf

retrieveMultiple(config, "accounts")
.then(
    (results) => {
        this.accounts = results.value;
        console.log(this.accounts[0].name);
        console.log(this.accounts);
    },
    (error) => {
        console.log(error);
    }
)

<p>Accounts:</p>
<ul>
  <li *ngFor="let account of accounts">
    {{ account.name }}
  </li>
</ul>