Angular 英雄之旅 HttpClient CRUD 方法答案

【问题标题】：Angular Tour of Heroes HttpClient CRUD methodsAngular 英雄之旅 HttpClient CRUD 方法
【发布时间】：2018-05-27 01:40:13
【问题描述】：

我目前正在通过英雄之旅教程学习 Angular。在HTTP章节中，我不明白如何从服务器调用相应的英雄，看起来，只有一个url传递给模拟服务器，对于任何HttpClient.get（或其他CRUD）方法......

private heroesUrl = 'api/heroes'

以及所有英雄对应的get方法（~array）：

getHeroes (): Observable<Hero[]> {
  return this.http.get<Hero[]>(this.heroesUrl)
}

如果只返回一个英雄：

/** GET hero by id. Will 404 if id not found */

    getHero(id: number): Observable<Hero> {
      const url = `${this.heroesUrl}/${id}`;
      return this.http.get<Hero>(url).pipe(
        tap(_ => this.log(`fetched hero id=${id}`)),
        catchError(this.handleError<Hero>(`getHero id=${id}`))
      );

这个网址会返回什么？我的意思是它只是一个url，数据库api连接如何在后台响应url（或传递的id）？

其他发布方法也是如此：

addHero (hero: Hero): Observable<Hero> {
  return this.http.post<Hero>(this.heroesUrl, hero, httpOptions).pipe(..)
}

它有一个 url 参数，但是如何将实际的英雄传递给服务器呢？英雄 id 是在哪里创建的？

【问题讨论】：

这个例子不使用in-memory API吗？没有服务器，一切都在客户端。如果你想知道它是如何实现的，你可以查看源代码。
即使它在服务器上，Angular 也不在乎它是从文件中读取 CSV 的 PHP 脚本，还是连接到关系数据库的 Java servlet，还是从MongoDB。这超出了 Angular 的范围，它在浏览器中运行，并从服务器上的 RESTful Web 服务获取数据。

标签： angular http crud

【解决方案1】：

这个网址会返回什么？

当您执行 HttpClient.get 时，结果始终是可观察的。所以你会收到一个可观察的。

我的意思是它只是一个网址，如何数据库 api 连接在后台响应 url（或传递的 id）？

正如您在app.module.ts 中看到的那样：

 // The HttpClientInMemoryWebApiModule module intercepts HTTP requests
    // and returns simulated server responses.
    // Remove it when a real server is ready to receive requests.
    HttpClientInMemoryWebApiModule.forRoot(
      InMemoryDataService, { dataEncapsulation: false }
    )

它有一个 url 参数，但是如何将实际的英雄传递给服务器？英雄 id 是在哪里创建的？

您可以在此处找到有关“如何工作”的更多信息：https://github.com/angular/in-memory-web-api

【讨论】：