How do I make a component, directive and pipe public? This is because when I add them to declarations array in a module, they become visible everywhere in the module where they are declared and are private to the module. If I've to use outside the module what should be done.
Asked
Active
Viewed 911 times
2 Answers
3
You can use a shared Module which is responsible for sharing common components, pipes and directives
.
please note its just a naming convention to use sharedModule or coreModule
, but you can use any other module name eg xyzModule
. Import thing is that make sure common things are declared within export array
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { CustomComponent} from 'path';
import { CustomPipe} from 'path';
import { CustomDirective} from 'path';
@NgModule({
imports: [ CommonModule ],
declarations: [ CustomComponent, CustomPipe, CustomDirective],
exports: [ CustomComponent, CustomPipe, CustomDirective]
})
export class SharedModule { }
Use it in App/Root Module or any other feature or lazy loaded feature module like this,
AppModule Or let's say ClientModule
import {SharedModule } from 'path'
@NgModule({
imports: [..., sharedModule]
})

micronyks
- 54,797
- 15
- 112
- 146
-
Could you also please mention that the relevant items should be added to exports array? Also, it is not necessary that it has to be shared module and I believe it can be from any module's exports array. Please add these information in your answer so that I can mark it as answer. – Jyoti Prasad Pal Sep 03 '17 at 17:04
-
Yes logically you can export such items from `any module eg. xyzModule`. But its a naming convention given by `AngularTeam` so I suggested you to go with `sharedModule` and nothing so confusing. – micronyks Sep 03 '17 at 17:46
0
just need to make sure the relevant items are in your module's export line
exports: [ CustomComponent, CustomPipe, CustomDirective]
Then any other module that implements that module will have access to those things

diopside
- 2,981
- 11
- 23