Hello im using Angular 4. I have a component with some html that i want it to be showned in various components. But when i import my module into various others moduels it says that it only can be defined in one module... how can i make it work?
i want param-var to be showned in globales and resumen.
Console Error
ERROR Error: Uncaught (in promise): Error: Type ParamVarComponent is part of the declarations of 2 modules: GlobalesModule and ResumenModule! Please consider moving ParamVarComponent to a higher module that imports GlobalesModule and ResumenModule. You can also create a new NgModule that exports and includes ParamVarComponent then import that NgModule in GlobalesModule and ResumenModule.
PARAM VAR MODULE
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ParamVarRoutingModule } from './param-var-routing.module';
import { ParamVarComponent } from './param-var.component';
import { FormsModule, ReactiveFormsModule} from '@angular/forms';
@NgModule({
imports: [
CommonModule,
ParamVarRoutingModule,
FormsModule,
ReactiveFormsModule
],
declarations: [ParamVarComponent,
]
})
export class ParamVarModule { }
GLOBALES MODULE
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { GlobalesRoutingModule } from './globales-routing.module';
import { GlobalesComponent } from './globales.component';
import {ParamVarComponent} from '../param-var/param-var.component';
import { FormsModule, ReactiveFormsModule} from '@angular/forms';
@NgModule({
imports: [
CommonModule,
GlobalesRoutingModule,
FormsModule,
ReactiveFormsModule,
],
declarations: [GlobalesComponent,ParamVarComponent,
]
})
export class GlobalesModule { }
RESUMEN MODULE
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ResumenRoutingModule } from './resumen-routing.module';
import { ResumenComponent } from './resumen.component';
import { FormsModule, ReactiveFormsModule} from '@angular/forms';
import {ParamVarComponent} from '../param-var/param-var.component';
@NgModule({
imports: [
CommonModule,
ResumenRoutingModule,
FormsModule,
ReactiveFormsModule,
],
declarations: [ResumenComponent,ParamVarComponent,
]
})
export class ResumenModule { }
Create new SharedModule
(or any other name, but that one matches Angular's Style Guide). Declare and export your ParamVarComponent
there. Now you can import SharedModule
in any other module in your application as many times as you want. Since ParamVarComponent
is exported, you can use it inside of other modules as soon as those modules import SharedModule
.
@NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule
],
declarations: [ParamVarComponent],
exports: [ParamVarComponent]
})
export class SharedModule { }
@NgModule({
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
SharedModule
]
})
export class OtherModule#{ }
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.