Question

我对页面如何处理导入有一般性的疑问。将文件导入另一个文件时，导入文件中的导入文件声明和导入是否可用？

我建议不要将同一个组件导入多个模块，而是在主模块中导入组件，并在我想要使用的其他页面中继承该组件。我不知道如何做到这一点。当我单独导入主模块时（如下所示），我仍然会收到导入ChartComponent未定义的错误。如何将模块导入其他模块？

我有一个包含以下代码的页面：

main.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { MainPage } from './main';
import { MomentModule, TimeAgoPipe } from "angular2-moment";
import { AlertCardComponent } from '../../components/alert-card/alert-card';  
import { AlertCardManageComponent } from '../../components/alert-definition-card/alert-definition-card';  
import { ThingCardComponent } from '../../components/thing-card/thing-card';
import { ThingDetailsPage } from '../thing-details/thing-details';
import { AttributesPage } from "../attributes/attributes";

import { ChartComponent } from '../../components/chartist/chart.component';

@NgModule({
  declarations: [
    MainPage,
    AlertCardComponent,
    AlertCardManageComponent,
    ThingCardComponent,
    ChartComponent
  ],
  imports: [
    IonicPageModule.forChild(MainPage),
    MomentModule
  ],

  exports: [AlertCardComponent,AlertCardManageComponent,ThingCardComponent,ThingDetailsPage,AttributesPage]

})
export class MainPageModule { }

我想从此页面访问{ChartComponent}导入/声明，并让以下两个文件继承它：

things-details.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ThingDetailsPage } from './thing-details';
import { MomentModule } from "angular2-moment";
import { MainPageModule } from '../main/main.module'; 
// import { ChartComponent } from '../../components/chartist/chart.component';

@NgModule({
  declarations: [
    ThingDetailsPage,
    // ChartComponent
  ],
  imports: [
    IonicPageModule.forChild(ThingDetailsPage),
    MomentModule,
    MainPageModule
  ] 
})
export class ThingDetailsPageModule {}

+

attributes.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { AttributesPage } from "../attributes/attributes";
import { MainPageModule } from '../main/main.module';
import {MomentModule} from "angular2-moment";
// import { ChartComponent } from '../../components/chartist/chart.component';

@NgModule({
  declarations: [
    AttributesPage,
    // ChartComponent
  ],
  imports: [
    IonicPageModule.forChild(AttributesPage),
    MomentModule,
    MainPageModule
  ] 
})
export class AttributePageModule {}

如上所示，我将MainPageModule导入到我的每个子文件中，但是我仍然无法从main.module.ts文件中访问{ChartComponent}导入和声明。

任何帮助将不胜感激，谢谢。

Answer 1

所有模块都将导入主模块。

尝试使用main.module.ts：

imports: [
    IonicPageModule.forChild(MainPage),
    MomentModule,
    ThingDetailsPageModule,
    AttributePageModule
],

评论这些文件中的MainPageModule行

things-details.module.ts
attributes.module.ts

Answer 2

在主模块中，尝试将ChartComponent添加到exports: [AlertCardComponent,AlertCardManageComponent,ThingCardComponent,ThingDetailsPage,AttributesPage]中的列表中。

如何在Javascript中的组件文件之间导出/导入模块

2 个答案: