Question

我有一个Angular-CLI应用程序（Angular 6），它正在从另一个外部页面启动。因此，首先显示index.html。我可以使用index.html方法将数据从外部页面异步发送到postMessage。我的问题是如何将此数据传递给我的Angular应用程序。我有两个问题：

第一个是main.ts即时启动，到那时我还没有收到postMessage发送的数据。那么， 我如何推迟main.ts ？
第二件事是如何将数据发送到main.ts以及如何将其提供给我的应用程序？

index.html

<body>
  <script>

    window.onload = function () {
      window.parent.postMessage("Loaded", "*");
    }

    window.addEventListener("message",
      function(event) {
        if (event.origin !== 'http://localhost:8080') {
          return;
        }
        console.log("Yes!!!", event.data);
      });

  </script>
  <app-root>Loading...</app-root>
</body>

main.ts

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

export function getBaseUrl() {
  return document.getElementsByTagName('base')[0].href;
}

const providers = [
  { provide: 'BASE_URL', useFactory: getBaseUrl, deps: [] }
];

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic(providers).bootstrapModule(AppModule)
  .catch(err => console.log(err));

将外部数据传递给Angular-CLI应用程序

0 个答案: