-
-
Notifications
You must be signed in to change notification settings - Fork 78
Description
Question
Hello everybody!
I have multiple app arranged into a single-spa application.
Applications are written in Angular. I want use a component into app1 as parcel into app2.
Into app2 I have, in the component that must contain the parcel:
component.ts file
import { Component, OnInit } from '@angular/core';
import {mountRootParcel} from 'single-spa';
const windowAny: any = window;
export class AppComponent {
mountParcel = mountRootParcel;
async config() {
return windowAny.System.import('@spa/app1')
}
parcelProps = {
loadComponent: 'map'
};
title = 'app2';
}
component.html file
< div id="spa1">
< parcel [config]="config" [mountParcel]="mountParcel" [customProps]="parcelProps" mode="parcel">
< /div>
parcelProps is an object with properties that I want to pass to app1. My idea is that when I invoke app1, if I have properties loadComponent and is valued to map, then I have load only map component, otherwise I have bootstrap the entire app1 application.
Into app1 application, in main.single-spa.ts, I have:
import { enableProdMode, NgZone } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { singleSpaAngular } from 'single-spa-angular';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
import { singleSpaPropsSubject } from './single-spa/single-spa-props';
if (environment.production) {
enableProdMode();
}
const lifecycles = singleSpaAngular({
bootstrapFunction: singleSpaProps => {
singleSpaPropsSubject.next(singleSpaProps);
return platformBrowserDynamic().bootstrapModule(AppModule);
},
template: '',
NgZone,
domElementGetter: () => document.getElementById('main-app')!
});
export const bootstrap = lifecycles.bootstrap;
export const mount = lifecycles.mount;
export const unmount = lifecycles.unmount;
In sigleSpaProps I can read loadComponent value when I invoke app1 as parcel.
The problem is: how do i tell the application app1 that it should load only the mapComponent component instead of the AppModule module?
Thanks a lot
Giuseppe
Environment
Libs:
- @angular/core version: 12.2.0
- single-spa-angular version: 5.0.2