home

package.json

     "@fortawesome/free-brands-svg-icons": "^5.15.4",
     "@fortawesome/free-regular-svg-icons": "^5.15.4",
     "@fortawesome/free-solid-svg-icons": "^5.15.4",
-    "@ionic-native/core": "^5.36.0",
     "@ionic-native/call-number": "^5.22.0-beta-1",
+    "@ionic-native/core": "^5.36.0",
     "@ionic-native/email-composer": "^5.36.0",
     "@ionic-native/geolocation": "^5.36.0",
     "@ionic-native/http": "^5.36.0",
     "@ionic-native/native-geocoder": "^5.36.0",
     "@ionic/angular": "^5.5.2",
-    "cordova-ios": "^4.0.1",
     "ionic-img-viewer": "^2.9.0",
     "rxjs": "~6.6.0",
     "tslib": "^2.2.0",
     "@typescript-eslint/eslint-plugin": "4.16.1",
     "@typescript-eslint/parser": "4.16.1",
     "call-number": "^1.0.1",
+    "cordova-ios": "^6.2.0",
     "cordova-plugin-add-swift-support": "^1.7.2",
+    "cordova-plugin-advanced-http": "^3.2.0",
     "cordova-plugin-device": "2.0.2",
     "cordova-plugin-email-composer": "^0.9.2",
+    "cordova-plugin-file": "^6.0.2",
     "cordova-plugin-geolocation": "^4.1.0",
     "cordova-plugin-googlemaps": "^2.7.1",
     "cordova-plugin-googlemaps-sdk": "github:mapsplugin/cordova-plugin-googlemaps-sdk",
     "karma-coverage-istanbul-reporter": "~3.0.2",
     "karma-jasmine": "~4.0.0",
     "karma-jasmine-html-reporter": "^1.5.0",
+    "mx.ferreyra.callnumber": "0.0.2",
     "protractor": "~7.0.0",
     "ts-node": "~8.3.0",
     "typescript": "~4.2.4"
         "LOCATION_WHEN_IN_USE_DESCRIPTION": "Use geocoder service"
       },
       "mx.ferreyra.callnumber": {},
-      "cordova-plugin-email-composer": {}
+      "cordova-plugin-email-composer": {},
+      "call-number": {}
     },
     "platforms": [
       "ios"
     ]
   }
-}
+}

src/app/app.module.ts

 
 import { CallNumber } from '@ionic-native/call-number/ngx';
 import { EmailComposer } from '@ionic-native/email-composer/ngx';
+import { HTTP } from '@ionic-native/http/ngx';
 
 // import { IonicImageViewerModule } from 'ionic-img-viewer';
 
 // library.add(fas,far,fab);
 
 @NgModule({
-  declarations: [AppComponent],
-  entryComponents: [],
-  imports: [HttpClientModule, BrowserModule, IonicModule.forRoot(), AppRoutingModule, FontAwesomeModule],
-  providers: [
-    Geolocation,
-    NativeGeocoder,
-    CallNumber,
-    EmailComposer,
-    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
-  ],
-  bootstrap: [AppComponent],
+    declarations: [AppComponent],
+    entryComponents: [],
+    imports: [HttpClientModule, BrowserModule, IonicModule.forRoot(), AppRoutingModule, FontAwesomeModule],
+    providers: [
+        Geolocation,
+        NativeGeocoder,
+        CallNumber,
+        EmailComposer,
+        HTTP,
+        { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
+    ],
+    bootstrap: [AppComponent],
 })
 export class AppModule {
-constructor(library: FaIconLibrary) {
-  library.addIconPacks(fas, fab, far);
-}
+    constructor(library: FaIconLibrary) {
+        library.addIconPacks(fas, fab, far);
+    }
 
 }

src/app/home/home.page.html

           <fa-icon [icon]="['fas', 'running']" size="3x"></fa-icon>
         </div>
       </ion-col> -->
+      {{ stores }}
       <ion-col size="3">
         <div class="center catshow">
           <a [routerLink]="['/tabs/place/']">
     </ion-row>
     <ion-row>
       <ion-col>
-        <ion-card *ngFor="let pldata of placelasted">
+        <ion-card *ngFor="let pldata of stores">
           <div *ngIf="pldata.better_featured_image != null">
             <img src="{{pldata.better_featured_image.source_url}}" alt="">
           </div>
           </div>
           <ion-card-header>
             <a [routerLink]="['/tabs/place/', pldata.id]">
-              <ion-card-title [innerHTML]="pldata.title.rendered"></ion-card-title>
+                <ion-card-title>{{ pldata.fields.name }}</ion-card-title>
             </a>
             <a [routerLink]="['/tabs/province/']">
-              <span [innerHTML]="pldata._embedded['wp:term'][1][0].name"></span>
+                <span>{{ pldata.fields.province }}</span>
             </a> /
+            
             <a [routerLink]="['/tabs/place/']">
-              <span [innerHTML]="pldata._embedded['wp:term'][2][0].name"></span>
-            </a>
+                <span>{{ pldata.fields.store_cat }}</span>
+            </a> 
           </ion-card-header>
         </ion-card>
       </ion-col>
     </ion-row>
   </ion-grid>
-</ion-content>
+</ion-content>

src/app/home/home.page.ts

     autoplay: true
   };
 
+    stores: any;
+
   constructor(public navCtrl: NavController, private wpservice: WpServiceService) { }
 
   ngOnInit() {
     });        
   }
 
+    ionViewWillEnter() {
+        this.wpservice.getStores().then( res => {
+            console.log(res);
+            this.stores = JSON.parse(res['data']);
+            //this.stores = JSON.parse(abc['stores']);
+            console.log(this.stores);
+        },
+        error => {
+                console.log(error);
+        }); 
+    }
+
 }

src/app/wp-service.service.ts

 import { Injectable } from '@angular/core';
 import { HttpClient,HttpClientModule } from '@angular/common/http';
+import { HTTP } from '@ionic-native/http/ngx';
 
 @Injectable({
   providedIn: 'root'
 })
 export class WpServiceService {
 
-  constructor(private http: HttpClient) { }
+  URLBASE = "http://192.168.1.141:8000/wellness/api/";
+  constructor(private http: HttpClient, private httpNative: HTTP) { }
 
   getSlideshow() {
     return this.http.get(
     );
   }
 
+    getStores() {
+        return this.httpNative.get(this.URLBASE + "stores", {}, {});
+    }
+
   getLasted() {
     return this.http.get(
       "/assets/json/place.json"