角度迭代数组对象答案

【问题标题】：Angular iterate object of arrays角度迭代数组对象
【发布时间】：2020-12-15 05:14:36
【问题描述】：

打字稿：

this.paises = this.api.getAllCountries();

        this.paises.forEach(item => {
            this.paisesData.push(item);
        });

角度：

 <ion-item button detail lines="inset" *ngFor="let pais of paisesData" (click)="paisesInfo(pais)">
            {{ pais.response }}
        </ion-item>

数组对象：

问题：

如何在其拥有的按钮中列出 response 数组中的每个国家/地区？

【问题讨论】：

标签： arrays angular typescript object ngfor

【解决方案1】：

再放一个循环

<ion-item button detail lines="inset" *ngFor="let pais of paisesData" (click)="paisesInfo(pais)">
  <ul>
    <li *ngFor="let country of pais.response">{{ country }}</li>
  </ul>
</ion-item>

【讨论】：

就是这样。谢谢。

【解决方案2】：

将响应数据插入数组，避免模板上出现多个循环。

this.paises = this.api.getAllCountries();

    this.paises.forEach(item => {
        this.paisesData.push(item.response);
    });

HTML：

 <ion-item button detail lines="inset" *ngFor="let pais of paisesData" (click)="paisesInfo(pais)">
        {{ pais }}
    </ion-item>

【讨论】：

我需要上一个答案中所建议的内部循环，因为没有它我无法为每个键创建单独的按钮。