3

all,

We are working on a single page web application, we are currently creating some new modules with Angular2+. To put all these new modules inside our old application, we created a loader to load NG modules. The loader is calling platform.bootstrapModule for each module to load some dynamically generated modules.

We are now implementing a communication solution to share state between modules by using @ngrx/store, by just injecting the StoreModule in platform providers, we can easily get a common store for all modules, but we have some problem of change detection because with platform.bootstrapModule all module have their own NgZone.

We found a workaround by calling platform._bootstrapModuleWithZone with a common NgZone instance. But this workaround is using a private method and we want to avoid that. Does anyone have some better solution?

You can found the example of change detection problem platform.bootstrapModule(AppModule1); platform.bootstrapModule(AppModule2);

http://plnkr.co/edit/E7tSAU67KnPDMV6dRWUB?p=preview

You can found the workaround platform._bootstrapModuleWithZone(AppModule1, [], zone); platform._bootstrapModuleWithZone(AppModule2, [], zone);

http://plnkr.co/edit/pHeBYwXTe5fdXZJSfu1F?p=preview, we found the workaround in Angular github issues: https://github.com/angular/angular/issues/10681

P.S. we cant really bootstrap a BaseModule and create dynamically all component inside the BaseModule because we need to inject some different Services for modules.

Shuang Wu
  • 53
  • 2
  • See https://stackoverflow.com/questions/39686305/changing-shared-data-between-root-modules and https://github.com/angular/angular/pull/17672 Seems we will get public api for that soon because https://github.com/angular/angular/issues/19252 – yurzui Sep 20 '17 at 14:06

0 Answers0