Question

我想使用延迟加载（当用户击中特定路线时）将Angular应用加载到另一个Angular应用中我可以编译第一个应用程序以便用于第二个应用程序吗？

应用程序的路由模块以嵌套到Angular应用程序中：

const upgradeRoutes: Routes = [
  {
    path: '/upgrade',
    component: HelloComponent
  },
  { path: '', redirectTo: '/upgrade', pathMatch: 'full' }
];

@NgModule({
  imports: [
    RouterModule.forChild(upgradeRoutes)
  ],
  exports: [
    RouterModule
  ],
  declarations: []
})
export class UpgradeRoutingModule { }

用于嵌套到Angular应用中的应用模块

@NgModule({
  declarations: [
    AppComponent,
    HelloComponent
  ],
  imports: [
    CommonModule,
    UpgradeRoutingModule
  ],
  exports: [
    UpgradeModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class UpgradeModule { }

我要在子路径中使用的应用模块（延迟加载）中使用的应用模块：

import {UpgradeModule} from '../../node_modules/module-upgrade/src/app/app.module'  

@NgModule({
   declarations: [
     ...
   ],
   import: [ UpgradeModule ]
});

1）我想了解一下这是否正确，和/或还有另一种方法可以做到。

2）另一个问题是子应用使用Angualr 6，而第二个/主要应用使用Angular 4。

Answer 1

要么：

不要引导您的子应用程序并将其用作子模块（这要求您将主应用程序升级到Angular 6，这至少需要重构您的RxJS操作员调用，并且可能还有其他一些小事情），
或者仅将您的Web服务器配置为在特定的URL上提供子应用。在这种情况下，您的两个应用程序将无法共享任何状态（全局名称空间，Cookie和localStorage除外），或者角组件/服务/指令/管道

如何在其他Angular应用的子路由中使用Angular应用？

1 个答案: