ionic3.x --- http 请求

1.ionic 中 中 get 请求数据

1. 在 app.module.ts 引入 HttpModule 、JsonpModule

import { HttpModule, JsonpModule } from '@angular/http';

2. 在 app.module.ts 依赖注入 HttpModule 、JsonpModule

@NgModule({
    declarations: [
    AppComponent,
    HomeComponent,
NewsComponent,
NewscontentComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
JsonpModule,
AppRoutingModule
],
providers: [StorageService,NewsService],
bootstrap: [AppComponent]
})
export class AppModule { }

3  在需要请求数据的地方引入 Http

import {Http,Jsonp} from "@angular/http";

4 、构造函数内申明：

constructor(private http:Http,private jsonp:Jsonp) { }

5、 对应的方法内使用 http 请求数据

this.http.get("http://www.phonegap100.com/appapi.php?a=getPortalList&ca
tid=20&page=1")
.subscribe(
function(data){
console.log(data);
},function(err){
console.log('失败');
}
);

 

this.jsonp.get("http://www.phonegap100.com/appapi.php?a=getPortalList&c
atid=20&page=1&callback=JSONP_CALLBACK")
.subscribe(
function(data){
console.log(data);
},function(err){
console.log('失败');
}
);

2.ionic 中 中 Post 提交数据

1. 入 引入 Headers 、Http 模块

import {Http,Jsonp,Headers} from "@angular/http";

2. 化 实例化 Headers

private headers = new Headers({'Content-Type': 'application/json'});

3.post 提交数据

this.http.post('http://localhost:8008/api/test', JSON.stringify({username: 'admin'}), {headers:this.headers})
    .subscribe(function(res){
        console.log(res.json());
});