Routage à travers plusieurs projets dans une seule application angular

Question

J'ai une application principale avec une application enfant. Je dois montrer l'application enfant lorsque je clique sur un lien d'ancrage qui se trouve dans l'application principale. Mais ça ne marche pas.

Structure du projet:

one-app
-project
--scrapper
---e2e
---src
-src

Dans le module de routage de mon application enfant, j'ai ajouté les itinéraires comme

const routes: Routes = [
  { path: '', component: HomeComponent}
];

et le composant d'application de l'application enfant

<router-outlet></router-outlet>

et dans le module d'application de l'application enfant, j'ai ajouté le code ci-dessous avec le code existant

@NgModule({})
export class ScrapperSharedModule {
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: AppModule,
      providers: []
    };
  }
}

Jusqu'à présent, tout va bien. J'imagine!!

Maintenant, dans le routage de l'application parent, j'ai ajouté les codes ci-dessous

{ path: 'scrapper',
    loadChildren: '../../projects/scrapper/src/app/app.module#ScrapperSharedModule'
}

et dans le module d'application de l'application parent, j'ai importé le code ci-dessous dans la partie ngmodule

imports: [
...
ScrapperSharedModule.forRoot(),
]

Maintenant, dans l'un des composants de mon application parent, j'ai une balise d'ancrage

<a routerLink="/scrapper">

Lorsque je clique sur ce lien, rien ne se passe. Je veux dire que l'URL change, mais le navigateur affiche l'application parent et non l'application enfant. Qu'est-ce que je fais mal ici?

Answer 1

Sur la base de la description, fondamentalement, vous voulez que vos deux applications fonctionnent en modèle SPA.

Dans ce cas, vous pouvez essayer de configurer les deux applications comme suggéré dans cet article ( https://medium.com/disney-streaming/combining-multiple-angular-applications-into-a-single-one -e87d530d6527 )