How to load an angular app inside a react shell mono

Question

I have a react shell nx-mono repo application. Also I have an angular mono-repo remote application which exposes the entry.routes.ts like below

My angular module-federation-config.ts file

import { ModuleFederationConfig } from '@nx/webpack';

const config: ModuleFederationConfig = {
  name: 'ang-remote1',
  exposes: {
    './Routes': 'ang-remote1/src/app/remote-entry/entry.routes.ts',
  },
};

export default config;

My entry.routes.ts looks like

import { Route } from '@angular/router';
import { RemoteEntryComponent } from './entry.component';

export const remoteRoutes: Route[] = [
  { path: '', component: RemoteEntryComponent },
];

RemoteEntryComponent

import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';

@Component({
  standalone: true,
  imports: [CommonModule],
  selector: 'app-ang-remote1-entry',
  template: `Welcome to Angular`,
})
export class RemoteEntryComponent {}

I am tryin to load this angular module in a react shell application.

I am dynamically loading using loadRemoteModule method. and was able to fetch the module. I was able to get the remoteRoutes and RemoteEntryComponent, from the Module, but not sure how to load it. RemoteEntryComponent says "class a....".

Getting error while trying to load like this . I dont think that is correct, but couldnt find any correct solution.

Can anyone please help here. thanks.