Angular 6：Http升级答案

【问题标题】：Angular 6 : Http upgradeAngular 6：Http升级
【发布时间】：2018-11-19 10:29:30
【问题描述】：

我正在尝试发送一个 http 请求，根据 tutorial 我在 app.module.ts 中添加了 HttpClientModule，但在浏览器控制台中遇到以下错误。

模块声明的意外模块“HttpClientModule” '应用模块'。请添加@Pipe/@Directive/@Component 注解。

请帮忙。

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { LandingpageComponent } from './landingpage/landingpage.component';
import { HttpClientModule } from '@angular/common/http';

@NgModule({
  declarations: [
    AppComponent,
    LandingpageComponent,
    HttpClientModule
  ],
  imports: [
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

【问题讨论】：

任何答案是否有助于解决您的问题？如果是这样，请标记对您最有帮助的答案。谢谢！

标签： angular angular6

【解决方案1】：

将模块移出declarations 并移入imports 以解决此错误。您导入模块，而不是声明它们。

imports:[BrowserModule, HttpClientModule]

希望对您有所帮助！

【讨论】：

【解决方案2】：

declarations数组只适用于管道、指令和组件，需要在imports数组中添加模块

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { LandingpageComponent } from './landingpage/landingpage.component';
import { HttpClientModule } from '@angular/common/http';

@NgModule({
  declarations: [
    AppComponent,
    LandingpageComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

【讨论】：