Angular 迭代数组对象

Question

打字稿：

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

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

ANGULAR:

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

数组对象：

问题：

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

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

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

Angular 迭代数组对象

Angular iterate object of arrays

arrays

angular

typescript

object

ngfor