Question

我从离子v2，angular2和typeScript开始。所以我想设置一个离子登录页面，它检索登录凭据并联系远程api进行身份验证。我显然需要有角度的Http Client。

src / app / 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.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 {}

当然还定义了任何其他必要的文件（page / login / login。*和provider / auth-service.ts），因此不会丢失文件或服务错误。

问题：

当我通过ionic serve构建应用程序时，该过程完成且没有错误，但是当在浏览器中启动应用程序时，我收到此错误：

意外模块＆＃34; HttpModule＆＃34;模块宣布＆＃34; AppModule＆＃34;
不过，我只是按照this tutorial from the official documentation的说明进行操作几个小时以来我一直在谷歌搜索没有找到解决方法有人能告诉我我做错了什么吗？

Answer 1

您应该按照以下方式导入 HttpModule ，

imports: [   
    HttpModule,
    JsonpModule
    ...
    ...
}

注意：与 JsonpModule 相同。不要忘记将它们从 declarations 数组中删除。

Answer 2

declarations属性用于声明此模块中的每个组件和管道，允许您在模块中使用它们。

要在当前模块中使用另一个模块，您必须使用imports属性，如下所示：

@NgModule({
  declarations: [
    MyApp,
    LoginPage
  ],
  imports: [
    IonicModule.forRoot(MyApp),
    HttpModule,
    JsonpModule
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    LoginPage
  ],
  providers: [{provide: ErrorHandler, useClass: IonicErrorHandler},AuthService]
})

Answer 3

就Ionic 2而言，您根本无需单独导入 HttpModule 。 IonicModule在链接中为您做到这一点：

exports: [
    BrowserModule,
    HttpModule,
    FormsModule,
    ReactiveFormsModule,

您可以直接使用components.Similar for forms。

如何将角HttpModule导入根NgModule

3 个答案: