JS Angular 服务器端渲染应用设置渲染超时时间​​​​​​​

const express = require('express');
const app = express();
app.get('/api/fast', (req, res) => {
  console.log('fast endpoint hit');
  res.send({response: 'fast'});
});
app.get('/api/slow', (req, res) => {
  setTimeout(() => {
      console.log('slow endpoint hit');
      res.send({response: 'slow'});
  }, 5000);
});
app.listen(8081, () => {
  console.log('Listening');
});

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
@Injectable({
 providedIn: 'root'
})
export class CustomService {
 constructor(private http: HttpClient) {}
 public getFast(): Observable<any> {
   return this.http.get<any>('http://localhost:8081/api/fast');
 }
 public getSlow(): Observable<any> {
   return this.http.get<any>('http://localhost:8081/api/slow');
 }
}

import { Resolve } from '@angular/router';

import { isPlatformBrowser } from '@angular/common';

import { Injectable, Inject, PLATFORM_ID } from '@angular/core';

import { Injectable, Inject, PLATFORM_ID } from '@angular/core';
import { Resolve } from '@angular/router';
import { Observable, timer } from 'rxjs';
import { isPlatformBrowser } from '@angular/common';
import { CustomService } from './custom.service';
import { takeUntil } from 'rxjs/operators';
@Injectable({
 providedIn: 'root'
})
export class SlowComponentResolverService implements Resolve<any> {
 constructor(private service: CustomService, @Inject(PLATFORM_ID) private platformId: any) { }
 public resolve(): Observable<any> {
   if (isPlatformBrowser(this.platformId)) {
     return this.service.getSlow();
   }

const watchdog: Observable<number> = timer(500);

const routes: Routes = [
{path: '', redirectTo: 'fast', pathMatch: 'full'},
{path: 'fast', component: FastComponent},
{path: 'slow', component: SlowComponent, resolve: {response: SlowComponentResolverService}}
];

import { Component } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-slow',
template: `
  <p>
    Response is: {{response | json}}
  </p>
`,
styles: []
})
export class SlowComponent {

public response: any = this.router.snapshot.data.response;
constructor(private router: ActivatedRoute) {}
}