如何在ionic app中从服务器端获取多张图片？

import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-image-list',
  templateUrl: './image-list.component.html',
  styleUrls: ['./image-list.component.scss'],
})
export class ImageListComponent {
  imageUrls: string[] = [];

  constructor(private http: HttpClient) {
    this.getImagesFromServer();
  }

  getImagesFromServer() {
    const apiUrl = 'http://example.com/api/images'; // 替换为实际的API端点URL
    this.http.get(apiUrl).subscribe((response: any) => {
      this.imageUrls = response.imageUrls;
    });
  }
}

<ion-content>
  <ion-grid>
    <ion-row>
      <ion-col size="6" *ngFor="let imageUrl of imageUrls">
        <img [src]="imageUrl" alt="Image">
      </ion-col>
    </ion-row>
  </ion-grid>
</ion-content>