What is a shared module?

The Shared Module is the module in which you put commonly used directives, pipes, and components into one module that is shared(import it) throughout the application.

For example, the below shared module imports CommonModule, FormsModule for common directives and components, pipes and directives based on the need,

import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { UserComponent } from './user.component';
import { NewUserDirective } from './new-user.directive';
import { OrdersPipe } from './orders.pipe';
@NgModule({
imports: [CommonModule],
declarations: [UserComponent, NewUserDirective, OrdersPipe],
exports: [UserComponent, NewUserDirective, OrdersPipe, CommonModule, FormsModule],
})
export class SharedModule {}

June 03, 2022
187