Angular 4：注入 HttpClient 有什么好处答案

【问题标题】：Angular 4: What is advantage of injecting HttpClientAngular 4：注入 HttpClient 有什么好处
【发布时间】：2017-10-19 18:58:43
【问题描述】：

在Angular docs 之后，HttpClient 被注入到app 组件中。我在另一个指南上看到这是一个没有解释的“有利”。

@Component(...)
export class MyComponent implements OnInit {

  results: string[];

  // Inject HttpClient into your component or service.
  constructor(private http: HttpClient) {}

  ngOnInit(): void {
    // Make the HTTP request:
    this.http.get('/api/items').subscribe(data => {
      // Read the result field from the JSON response.
      this.results = data['results'];
    });
  }
}

对此我有一些问题：

1) Where/How is the HttpClient actually instantiated?  Does `ng serve` handle this?
2) How could I inject a different instance if I needed to?

【问题讨论】：

I saw on another guide that this was a "favorable" without explanation http 更有利，因为http 将被弃用。
关于2，见stackoverflow.com/questions/38213995/…。由于 HttpClient 的设计方式，您将很难做到这一点。通常使用单个 HttpClient 实例。
关于#2，参见Dependency Injection - When to use NgModule versus an application component。您可以在组件中指定提供程序，并为该组件及其子组件提供一个新实例。

标签： angular dependency-injection angular-httpclient

【解决方案1】：

实际上，HttpClient 是 Http 的改进替代品。他们希望在 Angular 5 中弃用 Http 并在以后的版本中将其删除。

或者你想知道为什么注入它是“有利的”？你注入服务。这就是服务在 Angular 中的工作方式。

与 Http 服务一样，HttpClient 服务在导入 Http 的模块加载时实例化。

预计该服务只有一个实例。我不知道你为什么想要不止一个？

【讨论】：

【解决方案2】：

ng 4.3+ 中引入的HttpClient/HttpClientModule 是对Http/HttpModule 的重新实现。举一个示例功能，而不是将您的 GET 结果映射到 JSON，然后挖掘可能存在或可能不存在的属性，您现在可以将返回的结果转换为控制结果/错误的用户定义界面。举个例子，在你更新你的 cli 和 npm 之后，创建一个像图片中那样的项目，然后在你的浏览器中查看标题！看，在你的界面中，你可以选择你想要映射回来的东西。

【讨论】：

这很有帮助！我已经尝试过使用 HttpClient 和泛型的其他示例，但无法从结果数组中获取数据，但订阅后的 forEach 可以解决问题。这行得通！

【解决方案3】：

当你想使用一个服务（它基本上是一个 TS 类）时，你需要先实例化它。这就是角喷射器自动为您做的事情。

这种方法是“有利的”，因为它会自动查找在其构造函数中定义的服务依赖项。

不确定第二个问题 - 如果您想注入同一类（服务）的另一个实例，则必须手动执行。

有关角度依赖注入的更多信息可以在他们的文档中找到：

https://angular.io/guide/dependency-injection

【讨论】：

谢谢。关于第二个问题，我想我只是好奇是否在某些情况下我们不希望 Angular 只处理引擎盖下的所有内容。这些文档很有帮助，谢谢