使用Angular HTTP client对数据模型进行删除操作

需求：Hero列表里每一个元素都有一个删除按钮，点击即可删除。

(1) hero列表的UI上，每个li元素内增添一个删除按钮。

delete函数的实现：

不仅删除Component本身heroes属性的对应元素，同时调用hero service删除远端服务器上的hero资源：

注意第43行的subscribe方法是必须的，即便没有指定任何回调函数，否则http请求不会发送出去。

(2) 调用http client实现服务器端的资源删除：

deleteHero(hero: Hero | number): Observable<Hero> {
  const id = typeof hero === 'number' ? hero : hero.id;
  const url = `${this.heroesUrl}/${id}`;

  return this.http.delete<Hero>(url, this.httpOptions).pipe(
    tap(_ => this.log(`deleted hero id=${id}`)),
    catchError(this.handleError<Hero>('deleteHero'))
  );
}