CODEWITHSUNDEEP
angulares6-classangular-module
wonderful world
wonderful world

Reputation: 11599

How to minimize the large number of import statement in an angular module?

In my angular module, I have 50 lines of import statements to import those classes and use in the declarations sections of the @NgModule.

In C++, there is a include file concept where you can put all the classes in a include file and use that file. How can I make my module more readable by hiding the details of the importing components?

This is how my @NgModule module file starts:

enter image description here

Upvotes: 1

Views: 773

Answers (1)

Avin Kavish
Avin Kavish

Reputation: 8947

You can have another module right next to the feature module that imports all the classes and re-exports them to be consumed by the feature module.

FeatureImportsModule.ts:

import { ComponentA } from 'path/to/file'
import { ComponentB } from 'path/to/file'
...


@NgModule({
  declarations: [
    ComponentA,
    ComponentB
    ....
    ],
  exports: [
    ComponentA,
    ComponentB,
    ...
  ]
})
export class FeatureImportsModule { }

FeatureModule.ts, this is the one that becomes "more readable":

@NgModule({
  imports: [ FeatureImportsModule ]
export class FeatureModule { }

Upvotes: 3

Related Questions