Angular4基本网络请求get、post方式
2017-11-06 本文已影响3377人
不伟心
angular2的网络请求和4还是有很大区别的,写一个项目的话肯定会用到http服务,除非你都是静态页,这只是一个最基本的、深入的拓展即可,希望能够帮助大家吧,谢谢
首先如果你想用这个服务、那么你需要在app.module.ts中引入如下:
imports: [
BrowserModule,
HttpModule,
RouterModule.forRoot(routes),
IonicModule.forRoot(MyApp,{
tabsHideOnSubPages: 'true' //隐藏全部子页面tabs
})
],
在所需要的面引入http:
import {Http, ResponseOptions,Headers,HttpModule,URLSearchParams} from "@angular/http";
然后注入:
constructor(private http:Http) {}
不带参数的post
this.http.post(randomUserUrl)
.map(res => res.json())
.subscribe(function (data) {
alert(JSON.stringify(data));
},err =>{
console.error('ERROR', err);
});
不带参数的get
this.http.get(randomUserUrl)
.map(res => res.json()) // (5)
.subscribe(data => {
alert(JSON.stringify(data));
},err =>{
console.error('ERROR', err);
});
带参数的⚠️注意post与get传参数方式不一样!
带参数的post, 注意一定要引入 URLSearchParams,要不请求是失败的:
let d1 = new URLSearchParams();
d1.append('key', 'value' );
d1.append('key', 'value' );
d1.append('key', ‘value’);
this.http.post(randomUserUrl,d1)
.map(res => res.json())
.subscribe(function (data) {
alert(JSON.stringify(data));
});
带参数的get
let dates ={
放参数keyvalue
};
this.http.get(randomUserUrl,{params: dataes})
.map(res => res.json()) // (5)
.subscribe(data => {
alert(JSON.stringify(data));
},err =>{
console.error('ERROR', err);
});
今天就介绍到这,谢谢