nx: Microfrontends are broken with [ nx 15.9.* ] when routing

Current Behavior

Inspired from https://nx.dev/more-concepts/micro-frontend-architecture, I have an angular workspace with one shell frontend and 2 remoteDevs frontends ( call them remote-dev1, and remote-dev2 ) that can be open by route change to /remote-dev1 and /remote-dev2 consequtively.

The application when running shows the shell frontend. In the Frontend, there are two links that route to /remote-dev1 and /remote-dev2.

The routing used work fine, and the corresponding microfrontends used to open on route change. However, since updating to nx version 15.9.*, it became buggy. The route change files, and i remain on the shell frontend. In the console, i get an angular core error that says inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with EnvironmentInjector#runInContext..

Expected Behavior

I should be routed to the corresponding remoteDevs frontends.

GitHub Repo

No response

Steps to Reproduce

1. have an angular microfrontend workspace with shell, remoteDev1 and remoteDev2.
2. on route change to remote-dev1 or 2 the error occurs.

Nx Report

Node : 18.12.1
   OS   : linux x64
   npm  : 8.19.3
   
   nx                      : 15.9.0
   @nrwl/js                : 15.9.2
   @nrwl/jest              : 15.9.2
   @nrwl/linter            : 15.9.2
   @nrwl/workspace         : 15.9.2
   @nrwl/angular           : 15.9.2
   @nrwl/cli               : 15.9.0
   @nrwl/cypress           : 15.9.2
   @nrwl/devkit            : 15.9.2
   @nrwl/eslint-plugin-nx  : 15.9.2
   @nrwl/tao               : 15.9.0
   @nrwl/webpack           : 15.9.2
   @nrwl/nx-cloud          : 16.0.1
   typescript              : 4.9.5
   ---------------------------------------
   Community plugins:
   @ngrx/component-store : 15.4.0
   @ngrx/effects         : 15.4.0
   @ngrx/store           : 15.4.0
   @ngrx/store-devtools  : 15.4.0
   @onventis/icon-font   : 1.10.0
   @onventis/ng          : 15.3.0
   ---------------------------------------
   The following packages should match the installed version of nx
     - @nrwl/js@15.9.2
     - @nrwl/jest@15.9.2
     - @nrwl/linter@15.9.2
     - @nrwl/workspace@15.9.2
     - @nrwl/angular@15.9.2
     - @nrwl/cypress@15.9.2
     - @nrwl/devkit@15.9.2
     - @nrwl/eslint-plugin-nx@15.9.2
     - @nrwl/webpack@15.9.2

   To fix this, run `nx migrate nx@15.9.2`

Failure Logs

I get the following error in the console, when trying to change route to the remote-devs.


re.mjs:8416 ERROR Error: Uncaught (in promise): Error: NG0203: inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with `EnvironmentInjector#runInContext`. Find more at https://angular.io/errors/NG0203
Error: NG0203: inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with `EnvironmentInjector#runInContext`. Find more at https://angular.io/errors/NG0203
    at injectInjectorOnly (core.mjs:626:15)
    at Module.ɵɵinject (core.mjs:637:60)
    at Object.RouterModule_Factory [as useFactory] (router.mjs:443:99)
    at Object.factory (core.mjs:8118:38)
    at R3Injector.hydrate (core.mjs:8031:35)
    at R3Injector.get (core.mjs:7919:33)
    at injectInjectorOnly (core.mjs:633:33)
    at ɵɵinject (core.mjs:637:60)
    at useValue (core.mjs:7713:65)
    at R3Injector.resolveInjectorInitializers (core.mjs:7968:17)
    at resolvePromise (zone.js:1193:31)
    at resolvePromise (zone.js:1147:17)
    at zone.js:1260:17
    at _ZoneDelegate.invokeTask (zone.js:402:31)
    at core.mjs:23892:55
    at AsyncStackTaggingZoneSpec.onInvokeTask (core.mjs:23892:36)
    at _ZoneDelegate.invokeTask (zone.js:401:60)
    at Object.onInvokeTask (core.mjs:24193:33)
    at _ZoneDelegate.invokeTask (zone.js:401:60)
    at Zone.runTask (zone.js:171:47)
handleError @ core.mjs:8416
Show 1 more frame

Additional Information

No response