浅谈Angular HttpClient简单入门

现代浏览器支持使用两种不同的 api 发起 http 请求：xmlhttprequest 接口和 fetch() api。

@angular/common/http 中的 httpclient 类为 angular 应用程序提供了一个简化的 api 来实现 http 客户端功能。

一、准备工作

首先在app.module.ts 导入 httpclientmodule。如下：

import { httpclientmodule } from '@angular/common/http';
@ngmodule({
 imports: [
  httpclientmodule,
 ]
})
export class appmodule {}

二、在需要引用httpclient的service.ts中引入httpclient，如下：

import { httpclient } from '@angular/common/http';
export class configservice {
 constructor(private http: httpclient) { }
}

三、请求数据

return this.http.get/post(url:'请求地址' ,
  options: {
   headers: this.headers
  })
   .topromise()
   .then((data: any) => {
    return data;
   })
   .catch((err) => {
    console.log(err);
   });
 }

四、在对应的component.ts文件中引入service

数据格式：

{
  "lists":[
    {"title":"","pic":""},
    {"title":"","pic":""}
  ]
}

五、页面上调用

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。