Angular 和 Ionic：尝试区分“[object Object]”时出错只允许数组和可迭代对象

如何解决Angular 和 Ionic：尝试区分“[object Object]”时出错只允许数组和可迭代对象

当我想通过 REST API 从服务器接收数据并通过模态将其显示在 HTML 组件中时出现此错误。在控制台中，如果我获得了数据，但在我的 HTML 视图中没有。

providers/musics/musics.ts

const API:string ="https://webapi.bps.go.id/v1/api/domain/type/prov/prov/1300/key/790ab00650e59132961637e651ba47fb/";
@Injectable()
export class MusicsProvider {

  constructor(public http: HttpClient) {
    console.log('Hello MusicsProvider Provider');
  }
  getMusic(){
    return this.http.get<any[]>(API);
  }

home.ts

    public allMusic =[];

  constructor(public navCtrl: NavController,public loadingController:LoadingController,private musicProvider: MusicsProvider) {
    

  }
  ionViewDidLoad(){
    let allMusicLoadingController = this.loadingController.create({
        content: "getting your songs from server"
    });
    allMusicLoadingController.present();

    this.musicProvider.getMusic()
        .subscribe((musicList) => 

            {
            allMusicLoadingController.dismiss();
            this.allMusic= musicList
        });
  }

home.html

<ion-content padding>
  <ion-card *ngFor="let music of allMusic">
    <ion-card-content>
      <ion-card-title>{{music.domain_name}}</ion-card-title>
    </ion-card-content>
  </ion-card>
</ion-content>

这是json服务

{"status":"OK","data-availability":"available","data":[{"page":1,"pages":1,"total":34},[{"domain_id":"1100","domain_name":"Aceh","domain_url":"https:\/\/aceh.bps.go.id"},{"domain_id":"1200","domain_name":"Sumatera Utara","domain_url":"https:\/\/sumut.bps.go.id"},{"domain_id":"1300","domain_name":"Sumatera Barat","domain_url":"https:\/\/sumbar.bps.go.id"},{"domain_id":"1400","domain_name":"Riau","domain_url":"https:\/\/riau.bps.go.id"},{"domain_id":"1500","domain_name":"Jambi","domain_url":"https:\/\/jambi.bps.go.id"},{"domain_id":"1600","domain_name":"Sumatera Selatan","domain_url":"https:\/\/sumsel.bps.go.id"},{"domain_id":"1700","domain_name":"Bengkulu","domain_url":"https:\/\/bengkulu.bps.go.id"},{"domain_id":"1800","domain_name":"Lampung","domain_url":"https:\/\/lampung.bps.go.id"},{"domain_id":"1900","domain_name":"Kep. Bangka Belitung","domain_url":"https:\/\/babel.bps.go.id"},{"domain_id":"2100","domain_name":"Kep. Riau","domain_url":"https:\/\/kepri.bps.go.id"},{"domain_id":"3100","domain_name":"Dki Jakarta","domain_url":"https:\/\/jakarta.bps.go.id"},{"domain_id":"3200","domain_name":"Jawa Barat","domain_url":"https:\/\/jabar.bps.go.id"},{"domain_id":"3300","domain_name":"Jawa Tengah","domain_url":"https:\/\/jateng.bps.go.id"},{"domain_id":"3400","domain_name":"Di Yogyakarta","domain_url":"https:\/\/yogyakarta.bps.go.id"},{"domain_id":"3500","domain_name":"Jawa Timur","domain_url":"https:\/\/jatim.bps.go.id"},{"domain_id":"3600","domain_name":"Banten","domain_url":"https:\/\/banten.bps.go.id"},{"domain_id":"5100","domain_name":"Bali","domain_url":"https:\/\/bali.bps.go.id"},{"domain_id":"5200","domain_name":"Nusa Tenggara Barat","domain_url":"https:\/\/ntb.bps.go.id"},{"domain_id":"5300","domain_name":"Nusa Tenggara Timur","domain_url":"https:\/\/ntt.bps.go.id"},{"domain_id":"6100","domain_name":"Kalimantan Barat","domain_url":"https:\/\/kalbar.bps.go.id"},{"domain_id":"6200","domain_name":"Kalimantan Tengah","domain_url":"https:\/\/kalteng.bps.go.id"},{"domain_id":"6300","domain_name":"Kalimantan Selatan","domain_url":"https:\/\/kalsel.bps.go.id"},{"domain_id":"6400","domain_name":"Kalimantan Timur","domain_url":"https:\/\/kaltim.bps.go.id"},{"domain_id":"6500","domain_name":"Kalimantan Utara","domain_url":"https:\/\/kaltara.bps.go.id"},{"domain_id":"7100","domain_name":"Sulawesi Utara","domain_url":"https:\/\/sulut.bps.go.id"},{"domain_id":"7200","domain_name":"Sulawesi Tengah","domain_url":"https:\/\/sulteng.bps.go.id"},{"domain_id":"7300","domain_name":"Sulawesi Selatan","domain_url":"https:\/\/sulsel.bps.go.id"},{"domain_id":"7400","domain_name":"Sulawesi Tenggara","domain_url":"https:\/\/sultra.bps.go.id"},{"domain_id":"7500","domain_name":"Gorontalo","domain_url":"https:\/\/gorontalo.bps.go.id"},{"domain_id":"7600","domain_name":"Sulawesi Barat","domain_url":"https:\/\/sulbar.bps.go.id"},{"domain_id":"8100","domain_name":"Maluku","domain_url":"https:\/\/maluku.bps.go.id"},{"domain_id":"8200","domain_name":"Maluku Utara","domain_url":"https:\/\/malut.bps.go.id"},{"domain_id":"9100","domain_name":"Papua Barat","domain_url":"https:\/\/papuabarat.bps.go.id"},{"domain_id":"9400","domain_name":"Papua","domain_url":"https:\/\/papua.bps.go.id"}]]}

解决方法

根据似乎的错误，您需要对数组而不是对象执行迭代。看起来像您需要按照以下步骤解决问题所需的附加代码。

您需要从 API 的响应中捕获数据 - 它包含对象数组。

//声明存储变量 pageList:any = [];

一旦 API 的响应得到您需要将数据对象数据分配到 pageList obj 中，就像这样。

this.pageList = response.data;

就是这样。