Clever Geek Handbook

How to use parent module component in child module component in angular2

I have a header that needs to be used in both the child and the parent module. It was imported and used in the parent module, but when trying to import and use in the child component, it shows an error. I mean how to use a common header for parent and child module

+3


source to share


2 answers


You need to create a shared module with the components you want to use, export those components, and import the shared module into other modules (parent and child for your case).

General module:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SharedComponent1 } from "./SharedComponent1";
import { SharedComponent2 } from "./SharedComponent2";

@NgModule({
imports: [
    CommonModule
],
declarations: [
    SharedComponent1,
    SharedComponent2
],
exports: [
    SharedComponent1,
    SharedComponent2
]
})
export class SharedModule {}


Using a common module:

import { NgModule }       from '@angular/core';
import { CommonModule }   from '@angular/common';
...
import { SharedModule } from './SharedModule';

@NgModule({
imports: [
    CommonModule,
    ...
    SharedModule
],
declarations: [
    ...
],
providers: [
    ...
]
})
export class AppModule{}
+8


source


It would be great if you could share the code and the specified error you are getting.

As per my understanding, you basically want to pass some data from the parent component to its child component.

For this you need to use @Input to pass parent parameters to child.



Component Parent-child interaction

Let me know if it helps or not

-1


source






More articles:


All Articles