woocommerce-api不填充变量以以离子形式显示数据

Question

我使用woocommmerce-api和ionic从woocommerce网站提取数据，但是它没有在前端显示数据，我可以在控制台中看到数据。 当尝试将其分配给变量时，它将返回null / undefined。 有人可以帮忙/建议解决方案。下面的代码段。

import { Component } from '@angular/core';
import { NavController,ToastController } from 'ionic-angular';
import * as WC from 'woocommerce-api';
import { WoocommerceProvider } from '../../providers/woocommerce/woocommerce';
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  WooCommerce: any;
  products: any[];
  moreProducts: any[];
  page: number;
  searchQuery: string = "";

  constructor(public navCtrl: NavController,private WP: WoocommerceProvider, public toastCtrl: ToastController) {
    this.page = 2;

    this.WooCommerce = WP.init();
    this.products=[]
    this.WooCommerce.getAsync("products").then( (data) => {
      console.log(data.toJSON().body); --> this shows data in console.
      this.products = data.toJSON().body;
    }, (err) => {
      console.log(err)
    })

    console.log(this.products); --> in console this is empty/undefined

  }