Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Inherit imports from parent module to child module in Angular2

I made an Angular2 app like described here. It has two components (A,B) which are imported by the global app.module. My idea was, to include shared modules in app.module, so I don't need to mess up every module with redundant code. I want to do that for example with the FormsModule. So in the app.module I have

imports: [
    UniversalModule,
    CommonModule,
    FormsModule,
    AModule
    RouterModule.forRoot([])
],

exports: [FormsModule]

But in the A module I got the exception Can't bind to 'ngModel' since it isn't a known property of 'select'. which seems caused by the missing FormsModule. It only works, when I import the FormsModulein every child module too using imports: [FormsModule]. That's exactly what I want to avoid.

According to this question, I tried to import the AppModule in the child module A. This doesn't work and give me the exception Exception: Call to Node module failed with error: Error: Unexpected value 'undefined' imported by the module 'AModule'

How can I inherit the imports to child modules? I need this for pipes, too.

like image 363
Lion Avatar asked Feb 12 '17 19:02

Lion


People also ask

How do you use the parent module component in a child module?

You should export the components of the parent module, you want to use in the child module. Then import the parent module in the child module. Show activity on this post. It would have been great , if you can share the code and the specified the error you are getting.

What is BrowserModule in Angular?

BrowserModule provides services that are essential to launch and run a browser application. BrowserModule also re-exports CommonModule from @angular/common , which means that components in the AppModule also have access to the Angular directives every application needs, such as NgIf and NgFor .


1 Answers

Just create a feature module (or shared module) that exports the components, directives, and pipes, that are usually used together and import this module to modules where you want to use any of these.

There is no way to make components, directives, or pipes available globally. They need to be added to imports of every module where they are used. All you can do is combine modules and make them available by importing only a single or few modules.

like image 55
Günter Zöchbauer Avatar answered Sep 20 '22 14:09

Günter Zöchbauer