manfredsteyer / module-federation-with-angular-dynamic

Dynamic Module Federation with Angular
124 stars 69 forks source link

Load dynamic remote module without routing #42

Open Angelotas opened 2 years ago

Angelotas commented 2 years ago

Is there any way to load lazy remote modules without loadChildren in RouterModule? I guess it's not possible to use import('https://example.es/remoteEntry.js).then()... and ComponentFactoryResolver. Do you know any solution?

empro-narendervaddepelly commented 10 months ago

Any solutions?

antsfiles commented 8 months ago

See here:

 async load(): Promise<void> {

     const m = await loadRemoteModule({
       type: 'module',
       remoteEntry: 'http://localhost:4201/remoteEntry.js',
       exposedModule: './Component'
     });

     const ref = this.viewContainer.createComponent(m.MyTicketsComponent);
     // const compInstance = ref.instance;
 }

Using the example here, this works:

export class AppComponent {
  title = 'shell';

  @ViewChild('placeHolder', { read: ViewContainerRef })
  viewContainer!: ViewContainerRef;

  async load(): Promise<void> {
    const component = await loadRemoteModule('users', './Component').then(
      (m) => m.AppComponent
    );
    this.viewContainer.createComponent(component);
  }
}