How to reference external NgModule components in the replaced component?

[alexandis]

ABP 5.1.2 / Angular

I've replaced the ABP Tenant component:

      this.replaceableComponents.add({
        component: TenantsComponent,
        key: eSaasComponents.Tenants,
      }),

Since this component does not have its own module (it reuses TenantManagementModule) - I cannot make use of declarations property of NgModule to add some additional components which I am gonna use in my TenantsComponent. How to resolve this?

NOTE: those additional components are from another project which are exported via its NgModule.

I've tried to import this external NgModule in app.module.ts, but then I get page loop reload. And besides I'm not sure it's correct - I need this module only for specific pages including Tenant page.

[mahmut-gundogdu]

You should add your TenantsComponent and its own dependencies to app.module.ts then it will work with any issue. Here I have created an example. You can check the app.module.ts

https://github.com/mahmut-gundogdu/abp-io-replacable-component-with-3party-deps.

[alexandis]

Isn't it a problem, if I use replaceableComponentsService in App.component, not Home.component? Unfortunately, now our requirements have changed and I cannot check your solution right away.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.