一，今日任务

1，今天学习了   HttpClient

大多数前端应用都需要通过 HTTP 协议与后端服务器通讯。现代浏览器支持使用

两种不同的 API 发起 HTTP 请求：XMLHttpRequest 接口和 fetch() API。

@angular/common/http 中的 HttpClient 类为 Angular 应用程序提供了一个

简化的 API 来实现 HTTP 客户端功能。它基于浏览器提供的 XMLHttpRequest 接口。

 HttpClient 带来的其它优点包括：可测试性、强类型的请求和响应对象、发起请

求与接收响应时的拦截器支持，以及更好的、基于可观察（Observable）对象的 

API 以及流式错误处理机制。

操作流程

1要想使用 HttpClient，就要先导入 Angular 的 HttpClientModule。大多数应用都

  会在根模块 AppModule 中导入它。

2在 AppModule 中导入 HttpClientModule 之后，你可以把 HttpClient 注入到应用类中
3应用通常会从服务器上获取 JSON 数据。 比如，该应用可能要从服务器上获取配置

  文件 config.json，其中指定了一些特定资源的 URL。

{

  "heroesUrl": "api/heroes",

  "textfile": "assets/textfile.txt"

}

4ConfigService 会通过 HttpClient 的 get() 方法取得这个文件

configUrl = 'assets/config.json';

getConfig() {

  return this.http.get(this.configUrl);

}

像 ConfigComponent 这样的组件会注入 ConfigService，并调用其 getConfig 方法

showConfig() {

  this.configService.getConfig()

    .subscribe((data: Config) => this.config = {

        heroesUrl: data['heroesUrl'],

        textfile:  data['textfile']

    });

}

把数据发送到服务器

除了从服务器获取数据之外，HttpClient 还支持修改型的请求，也就是说，通过 PUT、POST、DELETE 这样的 HTTP 方法把数据发送到服务器。

本指南中的这个范例应用包括一个简化版本的《英雄指南》，它会获取英雄数据，并允许用户添加、删除和修改它们。

下面的这些章节中包括该范例的 HeroesService 中的一些方法片段。

发起一个 POST 请求

应用经常把数据 POST 到服务器。它们会在提交表单时进行 POST。 下面这个例子中，HeroesService 在把英雄添加到数据库中时，就会使用

/** POST: add a new hero to the database */

addHero (hero: Hero): Observable<Hero> {

  return this.http.post<Hero>(this.heroesUrl, hero, httpOptions)

    .pipe(

      catchError(this.handleError('addHero', hero))

    );

}

HttpClient.post() 方法像 get() 一样也有类型参数（你会希望服务器返回一个新的英雄对象），它包含一个资源 URL。

它还接受另外两个参数：

1. hero - 要 POST 的请求体数据。

2. httpOptions - 这个例子中，该方法的选项指定了所需的请求头。

1. 2，学习了解angular任务6-10的路由逻辑

2. 
   

二，明天继续边学习angular边做任务。