selfHttp.service.ts
import {Injectable} from '@angular/core';
import {HttpClient, HttpParams} from '@angular/common/http';
@Injectable()
export class selfHttp {
public restServer;
public http;
constructor(Http: HttpClient) {
this.http = Http;
this.restServer = 'http://127.0.0.0/';
}
public get(url, params?: Object, cb?: Function) {
let httpParams = new HttpParams();
console.log('get开始请求');
const vm = this;
if (params) {
for (const key in params) {
if (params[key]) {
httpParams = httpParams.set(key, params[key]);
}
}
}
vm.http.get(vm.restServer + url, {params: httpParams})
.subscribe(data => {
console.log('get请求结束', data);
cb(data);
});
}
public post(url, data?: Object, cb?: Function, options?: Object) {
console.log('post开始请求');
const vm = this;
vm.http.post(vm.restServer + url, data, options)
.subscribe(res => {
console.log('post请求结束', res);
cb(res);
});
}
public put(url, data?: Object, cb?: Function, options?: Object) {
console.log('put开始请求');
const vm = this;
vm.http.put(vm.restServer + url, data, options)
.subscribe(res => {
console.log('put请求结束', res);
cb(res);
});
}
public delete(url, params?: Object, cb?: Function) {
let httpParams = new HttpParams();
console.log('delete开始请求');
const vm = this;
if (params) {
for (const key in params) {
if (params[key]) {
httpParams = httpParams.set(key, params[key]);
}
}
}
vm.http.delete(vm.restServer + url, {params: httpParams})
.subscribe(data => {
console.log('delete请求结束', data);
cb(data);
});
}
}
注:
- 依赖于HttpClientModule
- 在app.module.ts里注入服务(全局)
providers: [selfHttp]
使用方法:
import {selfHttp} from './../service/selfHttp';
@Component({
selector: 'demo',
templateUrl: './demo.html'
})
export class Demo {
constructor(http:selfHttp) {
http.get('/url', {}, res => {
console.log('结果', res);
});
http.delete('/url', {}, res => {
console.log('结果', res);
});
http.post('/url', data, res => {
console.log('结果', res);
}, options);
http.put('/url', data, res => {
console.log('结果', res);
}, options);
}
}
httpOptions请求头参数通过options传入(目前还没撸到这个,可能会有问题,后面做完记得来补充。)