Dear friends
Hope you will be fine, Actually I am facing some problems with woocommerce in ionic. I am trying to display woocommerce products in ioinc app. Everything works fine in console log but not displaying in a page Can you help me please???
///////////////////////////////////////////////////////////////////////////////////////////////////////
Saw my ts file:
import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import * as HA from 'woocommerce-api';
@Component({
selector: 'page-all-products',
templateUrl: 'all-products.html',
})
export class AllProductsPage {
WooCommerce: any;
products: any[]
constructor(public navCtrl: NavController, public navParams: NavParams) {
this.WooCommerce = HA({
url: 'MYWEBLINK',
consumerKey: 'MyConsumerkey',
consumerSecret: 'MYConsumerSecret',
wpAPI: true,
version: 'wc/v3',
queryStringAuth: true // Force Basic Authentication as query string true and using under HTTPS
})
this.WooCommerce.getAsync("products").then( (data) => {
console.log(JSON.parse(data.body));
this.products = JSON.parse(data.body).products;
}, (err) => {
console.log(err)
})
}
ionViewDidLoad() {
console.log('ionViewDidLoad AllProductsPage');
}
}
///////////////////////////////////////////////////////////////////////////////////////////////////////
Saw my html file:
<ion-header>
<ion-navbar>
<ion-title style=“text-align: center;”> Our Products </ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-list>
<ion-item *ngFor=“let product of Products”>
<ion-thumbnail>
<img [src]=“product.featured_src”>
</ion-thumbnail>
<h2> {{ product.title }} </h2>
<p>
<span [innerHTML]=“product.short_description”></span>
<span [innerHTML]=“product.price_html”></span>
</p>
</ion-item>
</ion-list>
</ion-content>
Can someone help me please???