Array from php server

Hi
I want to get data from php server and then use is as data.

For example , in html file the code will be

   <ion-list radio-group [(ngModel)]="quiz">
	 <ion-list-header>
	   {{phpdata[0].title}}
	 </ion-list-header>
	 <ion-item text-wrap *ngFor="#item of phpdata[0].options">
	 <ion-label>{{item}}</ion-label>
		   <ion-radio value={{i}}></ion-radio>
	 </ion-item>
   </ion-list>

and my data for this is as below (in construct it work well)

this.phpdata=[{title:'Question 01',options:['option1','option2','option3','option4']}];

now I want to get phpdata from my php web server. Plz help me.

You could create a injectable API service. Somthing in the lines of

import "rxjs/Rx";
import {Http, Headers} from "angular2/http";
import {Injectable} from "angular2/core";

@Injectable()
export class ApiService {
    
    constructor(private http: Http) { }

    get = {
        phpdata: () : Promise<any> => {
            return this.http.get("url-to-your-php-service").map(data => {             
                return data.json();
            }).toPromise();
        },
    }
}

Then use on your page

import {Page} from 'ionic-angular';
import {ApiService} from 'where-ever-you-put-the-api-service';

@Page({
  templateUrl: 'build/pages/page-title/page-title.html',
})
export class Page {
    
    phpdata: Array<any>;
    
    constructor(api: ApiService) { 
       api.get.phpdata().then(response =>  {
               this.phpdata = response;
           }
       );
    }
}

Will this help you?

2 Likes

I think that @dtaalbers provided a good starting point.

I would also recommend you to check out the following resources:

However note that currently there’s a zone.js issue which breaks Angular’s change detection when using Observables in combination with HTTP requests so you might need to use a workaround (check out the linked post for more details):

1 Like

But what will be code of php ?

thnx, but not clear. Here u have posted Two Codes. Second one will be in my .ts file. But first one will be on what page ?

You can use PHP function json_encode($array);

<?php
$arr = array(
  array('title' => 'Question 01', 'options' => array('option1', 'option2')),
  array('title' => 'Question 02', 'options' => array('option1', 'option2')),
);

echo json_encode($arr);

When you run this php file the output is:

[{"title":"Question 01","options":["option1","option2"]},{"title":"Question 02","options":["option1","option2"]}]
1 Like

Thank You so much. But I have big problem.

I copied data from https://randomuser.me/api/?results=2 and the data is like below

{"results":[{"gender":"male","name":{"title":"mr","first":"steven","last":"gardner"},"location":{"street":"2576 south street","city":"carrigtwohill","state":"pennsylvania","postcode":52394},"email":"steven.gardner@example.com","login":{"username":"bluepanda190","password":"hotties","salt":"7Nr7EIiy","md5":"f3468fae19493c7c927f377106d61748","sha1":"3c7a7f2bcb8c6c730e8853db75ffe54878fafffd","sha256":"c9e7ebd411972decb21e35a9e8e330217f0aba0bf91350d155d2bec0aa85345a"},"registered":1119156914,"dob":185687723,"phone":"071-011-8820","cell":"081-287-3648","id":{"name":"PPS","value":"8790143T"},"picture":{"large":"https://randomuser.me/api/portraits/men/70.jpg","medium":"https://randomuser.me/api/portraits/med/men/70.jpg","thumbnail":"https://randomuser.me/api/portraits/thumb/men/70.jpg"},"nat":"IE"},{"gender":"female","name":{"title":"ms","first":"nicoline","last":"johansen"},"location":{"street":"9298 ringgade","city":"støvring ","state":"nordjylland","postcode":51537},"email":"nicoline.johansen@example.com","login":{"username":"goldenmeercat679","password":"ireland","salt":"MvKKOYRZ","md5":"aedb99a5c946b15257074706925f59c6","sha1":"7967bb4afe98d941be5a71671a243f51591932e5","sha256":"899ebb6c86aaabe82c6e881737104155a41512472640a6c45de56a5ff51d1a3d"},"registered":1313539364,"dob":651853255,"phone":"19664193","cell":"28979851","id":{"name":"CPR","value":"627725-5033"},"picture":{"large":"https://randomuser.me/api/portraits/women/55.jpg","medium":"https://randomuser.me/api/portraits/med/women/55.jpg","thumbnail":"https://randomuser.me/api/portraits/thumb/women/55.jpg"},"nat":"DK"}],"info":{"seed":"10a36a8b14dfc17e","results":2,"page":1,"version":"1.0"}}

and just copied simply to my php file. http://need4engineer.com/api.php

but when
in service.ts I use https://randomuser.me/api/?results=2, its work fine. But when I use http://need4engineer.com/api.php, not working. But in browser both link file output is same.

what is the problem

@arctushar You haven’t set the response headers properly:

I would recommend you to:

Since the problem is not Ionic-related and the discussion is going off-topic I’m closing the topic.

1 Like