angular - Type X part of declarations 2 Modules - solution doesn't work with Dynamic Component -
i have component using in main application module. generates dynamic components using variety of modals. built setup module handling form wizards , wanted use same component part of setup module. works when tried use shared component imported main application module getting following error:
the code dynamic-components @ bottom of post.
so imported code setup module follows:
@ngmodule({ imports: [ commonmodule, formsmodule ], declarations: [ setupmodalpagecomponent, setupmodalcomponent, dynamicformcomponent, dynamiccomponent, /* import here */ /* modals */ setupdevicecomponent, setupeulacomponent, setupprofilecomponent ], providers: [ setupmodalservice ], exports: [ setupmodalpagecomponent, setupmodalcomponent, dynamicformcomponent, dynamiccomponent /* import here */ ] }) then following error:
i have found several posts issue , have said use component in main application module should make available other modules. didn't work me. tried add exports property main application module , export dynamiccomponent did not work me.
any ideas appreciated. thanks.
dynamic component:
import { component, input, viewcontainerref, viewchild, reflectiveinjector, componentfactoryresolver } '@angular/core'; /*** available components ***/ /* setup components */ import { setupdevicecomponent } '../../modules/setup/components/dynamic-forms/setup-device/setup-device.component'; import { setupeulacomponent } '../../modules/setup/components/dynamic-forms/setup-eula/setup-eula.component'; import { setupprofilecomponent } '../../modules/setup/components/dynamic-forms/setup-profile/setup-profile.component'; /* modal components */ import { alertmodal } '../site/modals/modals/alert/alert.modal'; import { changepasswordmodal } '../site/modals/modals/change-password/change-password.modal'; import { confirmmodal } '../site/modals/modals/confirm/confirm.modal'; @component({ selector: 'dynamic-component', entrycomponents: [ /* setup components */ setupdevicecomponent, setupeulacomponent, setupprofilecomponent, /* modal components */ alertmodal, changepasswordmodal, confirmmodal ], template: `<div #dynamiccomponentcontainer></div>`, }) export class dynamiccomponent { currentcomponent: = null; @viewchild('dynamiccomponentcontainer', { read: viewcontainerref }) dynamiccomponentcontainer: viewcontainerref; @input() set componentdata(data: {component: any, inputs: }) { if (!data) { return; } let inputproviders = object.keys(data.inputs).map((inputname) => { return { provide: inputname, usevalue: data.inputs[inputname] }; }); let resolvedinputs = reflectiveinjector.resolve(inputproviders); let injector = reflectiveinjector.fromresolvedproviders( resolvedinputs, this.dynamiccomponentcontainer.parentinjector ); let factory = this.resolver.resolvecomponentfactory(data.component); let component = factory.create(injector); this.dynamiccomponentcontainer.insert(component.hostview); if (this.currentcomponent) { this.currentcomponent.destroy(); } this.currentcomponent = component; } constructor(private resolver: componentfactoryresolver) {} }
i fixed removing import declaration appmodule , leaving import declaration , export in setupmodalmodule. components declared in appmodule still work though dependency declared in module. go figure.


Comments
Post a Comment