小编meh*_*yer的帖子

Angular Element无法解析另一个角度项目中的route（？），而是在网站上仅显示“ <router-outlet> </ router-outlet>”

以下起点：

我们有一些有角度的前端微服务，现在我们希望将它们整合到一个应用程序中。我们正在尝试使用Angular-Elements方法，并且已导出其中一个产生了巨大的JS文件的微服务。

问题

当我们在“将其放在一起”项目中包含角度元素时，仅在dom中包含“ router-outlet”标签，而不会呈现任何html。

码

自定义元素：

app.module.ts：

        import {NgModule, Injector} from '@angular/core';

    import {AppRoutingModule} from './app-routing.module';
    import {AppComponent} from './app.component';

    import {PhoneModule} from "./features/phone/phone.module";
    import {createCustomElement} from '@angular/elements';
    import {Router} from '@angular/router';

    @NgModule({
      declarations: [
        AppComponent,
      ],
      imports: [
        AppRoutingModule,
        PhoneModule,
      ],
      entryComponents: [AppComponent],
    })
    export class AppModule {

      constructor(private injector: Injector, private router: Router) {
        this.router = router;
      }

      ngOnInit() {
        this.router.initialNavigation();
      }

      ngDoBootstrap() {
        const customElement = createCustomElement(AppComponent, {injector: this.injector});
        customElements.define('phone-contracts', customElement);
      }
    }

Run Code Online (Sandbox Code Playgroud)

app-routing.module.ts：