typescript 如何将 Angular HttpModule 导入根 NgModule
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/42714284/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to import angular HttpModule to the root NgModule
提问by Philippe Simo
I am beginning with ionic v2, angular2 and typeScript. So i am trying to set up an ionic login page which retrieves login credentials and contact the remote api for authentication. I obviously need angular Http Client.
我从 ionic v2、angular2 和 typeScript 开始。所以我试图设置一个离子登录页面，它检索登录凭据并联系远程 api 进行身份验证。我显然需要角 Http 客户端。
The src/app/app.component.tslooks like:
在SRC /应用/ app.component.ts的样子：
import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar, Splashscreen } from 'ionic-native';
import { LoginPage } from '../pages/login/login';
@Component({
templateUrl: 'app.html'
})
export class MyApp {
rootPage = LoginPage;
constructor(platform: Platform) {
platform.ready().then(() => {
StatusBar.styleDefault();
Splashscreen.hide();
});
}
}
src/app/app.module.tslooks like:
src/app/app.module.ts看起来像：
import { NgModule, ErrorHandler } from '@angular/core';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';
import { LoginPage } from '../pages/login/login';
import { AuthService } from '../providers/auth-service';
import { HttpModule, JsonpModule } from '@angular/http';
@NgModule({
declarations: [
MyApp,
LoginPage,
HttpModule,
JsonpModule,
],
imports: [
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
LoginPage
],
providers: [{provide: ErrorHandler, useClass: IonicErrorHandler},AuthService]
})
export class AppModule {}
Of course any other necessary files (page/login/login.* and provider/auth-service.ts) are defined, so there is no missing file or service error.
当然，任何其他必要的文件（page/login/login.* 和 provider/auth-service.ts）都已定义，因此不会丢失文件或服务错误。
THE PROBLEM:
问题：
When i build the app via ionic serve, the process finishes without errors, but when launching the app in the browser, i get this error:
当我通过 构建应用程序时ionic serve，该过程没有错误地完成，但是在浏览器中启动应用程序时，我收到此错误：
Unexpected module "HttpModule" declared by the module "AppModule"
Nevertheless i am just following instructions from this tutorial from the official documentation.
I have been googling since a couple of hours without finding a workaround.
Can someone tell me what am i doing wrong?
模块“AppModule”声明的意外模块“HttpModule”
不过我只是按照官方文档中本教程的说明进行操作。
几个小时以来，我一直在谷歌上搜索，但没有找到解决方法。
有人能告诉我我做错了什么吗？
回答by micronyks
You should import HttpModuleas follow,
您应该HttpModule按如下方式导入，
imports: [
HttpModule,
JsonpModule
...
...
}
NOTE:Same with JsonpModule. And don't forget to remove them from declarationsarray.
注意：与JsonpModule. 并且不要忘记从declarations数组中删除它们。
回答by Supamiu
declarationsproperty is used to declare every components and pipes you have in this module, allowing you to use them in the module.
declarations属性用于声明您在此模块中拥有的每个组件和管道，允许您在模块中使用它们。
To use another module in the current one, you have to use importsproperty, like this:
要使用当前模块中的另一个模块，您必须使用imports属性，如下所示：
@NgModule({
declarations: [
MyApp,
LoginPage
],
imports: [
IonicModule.forRoot(MyApp),
HttpModule,
JsonpModule
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
LoginPage
],
providers: [{provide: ErrorHandler, useClass: IonicErrorHandler},AuthService]
})
回答by Suraj Rao
As far as Ionic 2 is concerned, you need not separately import HttpModuleat all. IonicModuledoes that for you like so in the link:
就 Ionic 2 而言，您根本不需要单独导入HttpModule。IonicModule会在链接中为您做到这一点：
exports: [
BrowserModule,
HttpModule,
FormsModule,
ReactiveFormsModule,
You can directly use the components.Similar for forms.
您可以直接使用组件。与表单类似。
