Ionic + PHP + CORS

@adnanu wrote:

a.png911x90 8.18 KB

My Home.html is

<ion-header>
  <ion-navbar>
     <ion-title>
        My Favourite Technologies
     </ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>

  <ion-item>
    <button class="add" ion-button item-right icon-right margin-bottom color="primary"(click)="addEntry()">
      Add a technology
      <ion-icon name="add"></ion-icon>
    </button>
  </ion-item>


  <ion-item *ngFor="let item of items">
     <h2>{{ item.name }} </h2>
     <button ion-button color="primary" item-right (click)="viewEntry({ record: item })">View</button>
  </ion-item>

</ion-content>

Home.ts

import { AddTechnologyPage } from './../add-technology/add-technology';
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

   public items : any = [];

   constructor(public navCtrl: NavController, public http: Http) {

   }


   ionViewWillEnter() {
      this.load();
   }

   // Retrieve the JSON encoded data from the remote server
   // Using Angular's Http class and an Observable - then
   // assign this to the items array for rendering to the HTML template
   load() {
      this.http.get('http://localhost:8080/ionic/retrieve-data.php').map(res => res.json()).subscribe(data => {
         this.items = data;
      });
   }


   // Allow navigation to the AddTechnology page for creating a new entry
   addEntry() {
      this.navCtrl.push(AddTechnologyPage);
   }


   // Allow navigation to the AddTechnology page for amending an existing entry
   // (We supply the actual record to be amended, as this method's parameter,
   // to the AddTechnology page
   viewEntry(param) {
      this.navCtrl.push(AddTechnologyPage, param);
   }


}

Posts: 3

Participants: 3

Read full topic