Angular Prerendering läuft mit setInterval()

aus Ich habe ein Visual Studio 2017 .NET Core 2.0-Projekt mit Angular-Vorlage. Das Vorrender-Zeitlimit wird überschritten, wenn ich eine der folgenden Zeilen "this.SetUpRefreshInterval()" auskommentiere. Die App gibt den Fehler "NodeInvocationException: Prerendering-Zeitüberschreitung nach 30000ms zurück, da die Startfunktion in 'ClientApp/dist/main-server' eine Zusage zurückgegeben hat, die nicht aufgelöst oder abgelehnt wurde. Stellen Sie sicher, dass die Startfunktion die Versprechung immer löst oder ablehnt." Irgendwelche Ideen?Angular Prerendering läuft mit setInterval()

Hier ist der Komponentencode:

import { Component, OnInit } from '@angular/core'; 

@Component({ 
selector: 'app-currentdatetime', 
templateUrl: './currentdatetime.component.html', 
styleUrls: ['./currentdatetime.component.css'] 
}) 
export class CurrentDateTimeComponent implements OnInit { 
    private currentDateTime: Date; 

    constructor() { 
     this.refreshDate(); 
     //this.setUpRefreshInterval(); 
    } 

    get currentDateFormatted(): String { 
     return this.currentDateTime.toLocaleDateString(); 
    }; 

    get currentTimeFormatted(): String { 
     return this.currentDateTime.toLocaleTimeString(); 
    }; 

    ngOnInit(): void { 
     //this.setUpRefreshInterval(); 
    } 

    private setUpRefreshInterval(): void { 
     setInterval(() => {   
      this.refreshDate(); 
     }, 1000); 
    } 

    private refreshDate(): void { 
     this.currentDateTime = new Date(); 
    } 
}

Ich habe auch versucht Observable.timer und bekam das gleiche Ergebnis mit:

private setUpRefreshInterval(): void { 
     let timer = Observable.timer(0, 1000); 
     timer.subscribe(t => this.currentDateTime = new Date()); 
    }

Als Abhilfe können, habe ich Krishnanunni Vorschlag und diese Änderung vorgenommen, die funktioniert:

import { Component, OnInit, Inject } from '@angular/core'; 
import { isPlatformBrowser } from '@angular/common'; 
import { PLATFORM_ID } from '@angular/core'; 

constructor(@Inject(PLATFORM_ID) private platformId: Object) { 
    this.refreshDate(); 
} 

ngOnInit(): void { 
    // setting up the refresh interval caused a timeout in prerendering, so only set up interval if rendering in browser 
    if (isPlatformBrowser(this.platformId)) { 
     this.setUpRefreshInterval();  
    }   
}

Quelle

2017-12-07 drewob

Warum rufen Sie die Funktion in Konstruktor und ngOninit. Ich würde Obseravble.timer (1000) anstelle von setInterval empfehlen und nicht, dass ich auf ngDestroy der Komponente –

nicht beabsichtige, die Funktion im Konstruktor AND ngOnInit aufzurufen. Ich möchte nur die zwei Orte zeigen, die ich ausprobiert habe. Beides verursacht das Prerender-Timeout. Ich habe die Frage bearbeitet, um zu zeigen, dass ich auch Observable.timer() versucht habe. – drewob

Versuchen Sie, den Intervallcode in isPlatformBrowser so zu verpacken, dass er nicht vorgerendert wird. Ich denke, Timeouts in pre-Rendering verursacht eine Art von Schleife –

Wickeln Sie den Intervall-Code in isPlatformBrowser Bedingung so tha t es ist nicht vor gerendert

Quelle

2017-12-07 20:24:02

Angular Prerendering läuft mit setInterval()

Antwort

Verwandte Themen