HTML не удается загрузить массив / Uncaught (в обещании)

Question

Я использую API woocommerce для загрузки подкатегорий на новой странице из родительских категорий с помощью ionic3.Я могу получить подкатегории, но моя проблема в том, что, когда я пытаюсь показать свои подкатегории, я получил ошибку, как показано на экране ниже:

и это мой код файла sub.ts:

import { Component, NgZone } from '@angular/core';
import { IonicPage, NavController, NavParams, ToastController } from 'ionic-angular';
import * as WC from 'woocommerce-api';


@IonicPage()
@Component({
  selector: 'page-subcategories',
  templateUrl: 'subcategories.html',
})
export class SubcategoriesPage {
  WooCommerce: any;
  page: number;
  categories: any = [];

  constructor(public navCtrl: NavController, public navParams: NavParams, public toastCtrl: ToastController, public ngZone: NgZone) {
    this.categories = this.navParams.get('category');

    this.WooCommerce = WC({
      url: "http:///",
      consumerKey: "///",
      consumerSecret:"///",
      wpAPI: true, // Enable the WP REST API integration
      queryStringAuth: true,
      verifySsl: true,
      version: 'wc/v3' 
    });

    this.WooCommerce.getAsync("products/categories?parent=" + this.categories.id).then((data) => {
      console.log(JSON.parse(data.body));
      this.ngZone.run(() => {
       this.categories = JSON.parse(data.body);
     })


    }, (err) => {
      console.log(err)
    });
  }

, а мой код файла sub.HTML:

<ion-content padding>

  <ion-list>
    <ion-item *ngFor="let sub of categories">
      <ion-icon name="arrow-forward" item-left large></ion-icon>
      <h2> {‌{ sub.name }} </h2>
    </ion-item>
 </ion-list>

</ion-content>

, и когда я выбираю родительскую категорию для отображения подкатегории Iполучить массив подкатегорий, как показано на экране ниже:

Есть ли какие-либо предложения отредактировать.

Answer 1

Попробуйте вместо этого объявить:

categories: any[] = [];

Answer 2

Я решил свою проблему, добавив

subcategories: any[] = [];

, а затем загрузил свои категории в подкатегории, такие как

 this.ngZone.run(() => {
        this.categories = JSON.parse(data.body);
         this.subcategories = this.categories
        console.log(this.subcategories );
     })

Answer 3

Вы должны перебрать ключ массива

@foreach (@yourcontainerData as $k=>$data)
{{$data.name}}
@endforeach

Здесь вы не выполняете итерацию, во всех случаях, если вы обращаетесь к первому элементу, тогда {{YourcontainerData [0] .name}} * * +1004