无法使Angular 5 StateTransfer工作

我一辈子都不能让这个有角度的

状态转移
工作。我已经学习了半打不同的教程，并将其归结为最简单的示例，但它根本不起作用。没有那么多的作品，我只是不知道我做错了什么。状态密钥永远不会被传递。所以我从来没有点击第一个if语句，它总是空的

这是我所有的课

更新：
所以我仍然没有让它工作，但是我注意到包含服务器状态的标记确实存在

<script id="fhh-app-state" type="application/json">{&q;featured_key&q;:&q;Im created on the server!&q;}</script>

app.server.module.ts

import { NgModule } from '@angular/core';
import { ServerModule, ServerTransferStateModule } from '@angular/platform-server';
import { ModuleMapLoaderModule } from '@nguniversal/module-map-ngfactory-loader';
import { BrowserModule } from '@angular/platform-browser';

import {AppModule} from './app.module';
import {AppComponent} from './app.component';

@NgModule({
  imports: [
    // BrowserModule.withServerTransition({appId: 'fhh-app'}),
    AppModule,
    ServerModule,
    ServerTransferStateModule, //  <-- needed for state transfer
    ModuleMapLoaderModule // <-- *Important* to have lazy-loaded routes work
  ],
  bootstrap: [AppComponent],
})
export class AppServerModule {}

@NgModule({
  declarations: [
    AppComponent,
    PageNotFoundComponent
  ],
  imports: [
    BrowserModule.withServerTransition({appId: 'fhh-app'}),
    BrowserTransferStateModule,
    ...
    ServiceWorkerModule.register('/ngsw-worker.js', {enabled: environment.production})
    ...
  ],
  providers: [
    CanDeactivateGuard,
    CancelDialogService,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

好的，我终于解决了我的问题。几乎所有的教程都遗漏了一个关键步骤。您必须将代码添加到
main.ts
文件中，以侦听要加载的DOM。下面是我必须添加的内容，以使其正常工作

document.addEventListener('DOMContentLoaded', () => {
  platformBrowserDynamic().bootstrapModule(AppModule).then(() => {
    if ('serviceWorker' in navigator && environment.production) {
      navigator.serviceWorker.register('/ngsw-worker.js');
    }
  })
    .catch(err => console.log(err));
});

希望这对别人有帮助

@NgModule({
  declarations: [
    AppComponent,
    PageNotFoundComponent
  ],
  imports: [
    BrowserModule.withServerTransition({appId: 'fhh-app'}),
    BrowserTransferStateModule,
    ...
    ServiceWorkerModule.register('/ngsw-worker.js', {enabled: environment.production})
    ...
  ],
  providers: [
    CanDeactivateGuard,
    CancelDialogService,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

document.addEventListener('DOMContentLoaded', () => {
  platformBrowserDynamic().bootstrapModule(AppModule).then(() => {
    if ('serviceWorker' in navigator && environment.production) {
      navigator.serviceWorker.register('/ngsw-worker.js');
    }
  })
    .catch(err => console.log(err));
});