Problem with import timepicker to shared.module.ts

[maciejniedzielski]

When I try to include timepicker to shared.module.ts I get this error:

compiler.js:485 Uncaught Error: Unexpected value '[object Object]' exported by the module 'SharedModule' at syntaxError (compiler.js:485) at eval (compiler.js:15247) at Array.forEach (<anonymous>) at CompileMetadataResolver.getNgModuleMetadata (compiler.js:15245) at CompileMetadataResolver.getNgModuleSummary (compiler.js:15132) at eval (compiler.js:15230) at Array.forEach (<anonymous>) at CompileMetadataResolver.getNgModuleMetadata (compiler.js:15208) at JitCompiler._loadModules (compiler.js:34404) at JitCompiler._compileModuleAndComponents (compiler.js:34365)

There is no problem when I import it to app.module and use in app.component, but this error occurs every time I try to "share" it. Could you please tell me what I'm doing wrong or fix it?

[Agranom]

It occurs when you try to import Timepicker module to SharedModule ? What does it mean you try to "share" it ?

[maciejniedzielski]

It mean that I just want to put this module to SharedModule and use Timepicker in different module than app.module.ts

[Agranom]

Can you download you app to github and show me? Or just show me the way you use it please

[maciejniedzielski]

Unfortunately I can't upload app code anywhere, so I will try to explain it.

Important app dir structure:
-src
-app
app.module.ts (root app module)
-shared
shared.module.ts (external libraries modules)

shared.module.ts has array named EXTERNAL_LIBRARIES_MODULES which includes modules of external libraries and this array is passed to shared.module.ts @NgModule imports array.

and this shared.module.ts is imported in app.module.ts

If it is't clear and understandable enough let me know.

[Agranom]

Yes, it's clear enough. Which version of angular do you use?

[maciejniedzielski]

@angular/core 5.2.4 and @angular-cli 1.6.8

[Agranom]

Ok, i'll try to reproduce it by my own

[Agranom]

I found out the problem. That's because you try to export NgxMaterialTimepickerModule.forRoot()
forRoot() function returns ModuleWithProviders, but you need to export NgModule. So add NgxMaterialTimepickerModule.forRoot() to imports and NgxMaterialTimepickerModule to exports in SharedModule and it should work.

[maciejniedzielski]

I did like you said but now this error has occured:

BUT, I forgot to mention (I think) very important fact: Modules are lazy loaded.
I also forgot to mention about one module in app tree

-src
   -- app
   app.module.ts
   -- shared
   shared.module.ts
   -- user-management
   user-management.module.ts

and in user.management.module.ts i've got these imports

Ultimately, I want to use timepicker in user-management.module.ts

Sorry for mistakes. Hope you will have some time to help me again 🙂

[Agranom]

I guess I found the problem. I updated library to 1.1.2 update it and tell me

[maciejniedzielski]

It works! Thank you so much for help! 😃