Feature Modules in Angular

 What is a feature module in angular?

1. Feature modules are NgModules for the purpose of organizing code
2. As your application grows, you can organize code relevant for a specific feature.
3. This helps apply clear boundaries for features.
4. With feature modules, you can keep code related to a specific functionality or feature separate from other code

Feature Modules vs Root Modules

1. A feature modules is an organizational best practice, as opposed to a concept of the core Angular API
2. A feature modules delivers a cohesive set of functionality focused on a specific application need such as a user workflow, routing, or forms
3. While you can do everything within the root module, feature modules helps you partition the application into focused areas
4. A feature module collaborates with the root module and with other modules through the services it provides and components, directives, and pipes that it shares

How to make a feature module

1. Assuming you already have an application that you created with Angular CLI, create a feature module using the CLI by entering the following command in the root project directory

ng generate module test


2. This will create a folder called Test with a file inside test.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; @NgModule({ imports: [ CommonModule ], declarations: [] }) export class CustomerDashboardModule { }

3. To generate the component

ng generate component test/myComponent

Importing a feature module

1. To incorporate the feature module into your app, you have to let the root module, app.module.ts know about it


Rendering a feature module's component template

1. When the CLI generated the component, for the feature module, it included a template 
2. You need to add exports array so that the component from the feature module can be used in root module
3. In the app.component you can use this as 
    <app-customer-module></app-customer-module>

















Comments