Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
ionic start pruebahttp1 blank
ionic g provider http
import { Injectable } from '@angular/core';
1 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
/*
Generated class for the HttpProvider provider.
See [Link]
[Link]
for more info on providers and Angular DI.
*/
@Injectable()
export class HttpProvider {
constructor(public http: Http) {
[Link]('Hello HttpProvider Provider');
}
import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-
angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { MyApp } from './[Link]';
import { HomePage } from '../pages/home/home';
import { PruebaProvider } from '../providers/prueba/prueba';
import { HttpModule } from '@angular/http';
@NgModule({
declarations: [
MyApp,
HomePage
],
2 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
imports: [
BrowserModule,
HttpModule,
[Link](MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
PruebaProvider,
]
})
export class AppModule {}
import { Injectable } from '@angular/core';
import { Http} from '@angular/http';
import 'rxjs/add/operator/map';
/*
Generated class for the HttpProvider provider.
See [Link]
[Link]
for more info on providers and Angular DI.
*/
@Injectable()
export class HttpProvider {
datos : any;
path : string = '[Link]
3 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
constructor(public http: Http) {
[Link]('Hello HttpProvider Provider');
}
loadUsers(){
return [Link]
.get([Link])
.map(res => [Link](),
err => {
[Link](err);
}
)
}
{
"results": [
{
"gender": "male",
"name": {
"title": "mr",
"first": "romain",
"last": "hoogmoed"
},
"location": {
"street": "1861 jan pieterszoon coenstraat",
"city": "maasdriel",
"state": "zeeland",
"postcode": 69217
},
"email": "[Link]@[Link]",
"login": {
"username": "lazyduck408",
"password": "jokers",
"salt": "UGtRFz4N",
"md5": "6d83a8c084731ee73eb5f9398b923183",
"sha1": "cb21097d8c430f2716538e365447910d90476f6e",
"sha256":
4 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
"5a9b09c86195b8d8b01ee219d7d9794e2abb6641a2351850c49c309f1fc204a0"
},
"dob": "1983-07-14 [Link]",
"registered": "2010-09-24 [Link]",
"phone": "(656)-976-4980",
"cell": "(065)-247-9303",
"id": {
"name": "BSN",
"value": "04242023"
},
"picture": {
"large": "[Link]
"medium": "[Link]
/[Link]",
"thumbnail": "[Link]
/men/[Link]"
},
"nat": "NL"
}
],
"info": {
"seed": "2da87e9305069f1d",
"results": 1,
"page": 1,
"version": "1.1"
}
}
<ion-header>
<ion-navbar>
<ion-title>
Usuarios
</ion-title>
</ion-navbar>
</ion-header>
<ion-content>
<ion-list>
<ion-item *ngFor="let usuario of usuarios">
5 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
<ion-avatar item-start>
<img [src]="[Link]">
</ion-avatar>
<h2>{{ [Link] }}</h2>
<p>{{ [Link] }}</p>
</ion-item>
</ion-list>
<button ion-button full (click) = "cargarUsuarios()">Cargar
Usuarios</button>
</ion-content>
import { HttpProvider } from '../../providers/http/http';
constructor(public navCtrl: NavController, public http:
HttpProvider) {
usuarios : any[];
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { HttpProvider } from '../../providers/http/http';
6 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
@Component({
selector: 'page-home',
templateUrl: '[Link]'
})
export class HomePage {
usuarios : any[];
constructor(public navCtrl: NavController, public http:
HttpProvider) {
cargarUsuarios(){
[Link]().subscribe( res => {
[Link] = [Link];
[Link]([Link])
},
error =>{
[Link](error);
});
}
7 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
import { Injectable } from '@angular/core';
import { Http} from '@angular/http';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
/*
Generated class for the HttpProvider provider.
See [Link]
[Link]
for more info on providers and Angular DI.
*/
@Injectable()
export class HttpProvider {
datos : any;
path : string = '[Link]
constructor(public http: Http) {
[Link]('Hello HttpProvider Provider');
}
loadUsers(){
return [Link]
.get([Link])
.map(res => [Link](),
err => {
[Link](err);
}
)
.toPromise();
}
cargarUsuarios(){
8 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
[Link]().then( res => {
[Link] = [Link];
[Link]([Link])
},
error =>{
[Link](error);
});
}
9 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
import { Http, Headers, RequestOptions } from '@angular/http';
postDatos(){
let datos = {
nombre:'Edu',email:'[Link]@[Link]'}
let headers = new Headers({
'Content-Type': 'application/x-www-form-urlencoded'
});
let options = new RequestOptions({
headers: headers
});
var url = '[Link]/adduser/';
return new Promise(resolve => {
[Link](url,[Link](datos),options)
.subscribe(data => {
resolve(data['_body']);
});
});
}
10 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
<?php
$postdata = file_get_contents("php://input");
if (isset($postdata)) {
$request = json_decode($postdata);
echo $request->nombre;
echo $request->email;
?>
11 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
S el primero en decir que te gusta.
12 de 13 7/09/2017 09:34
Tutorial de Ionic Peticiones http API REST | Reviblog [Link]
13 de 13 7/09/2017 09:34
