angular - Wie kann ich das aktuelle Datum in einer Vorlage überprüfen?

Ich habe ein Objekt mit einem Zeitstempel in meiner Komponente.

Was ich zu tun versuche, ist, den Zeitstempel zur Laufzeit in der Vorlage zu überprüfen. Zum Beispiel, um dem Benutzer den Online-Status eines Mitglieds anzuzeigen.. wenn online, zeige ich einen grünen Punkt, ansonsten sollte er während der Laufzeit live zu einem roten Punkt wechseln.

<div class="show_member_line">
  {{member.membername}} 
  <div *ngIf="member.lastactivity > ( !!!new Date().getTime()!!! - 120 )" class="status_online"></div>
  <div *ngIf="member.lastactivity < ( !!!new Date().getTime()!!! - 120 )" class="status_offline"></div>
</div>

Hat jemand eine Idee? :)

Antwort #1

Meiner Meinung nach wäre ein besserer Ansatz, einen Timer in Ihrer Komponente zu erstellen wie

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

private timerSubscription: any = null;
private lastActivityTime: Date;

ngOnInit(){
    let timer = Observable.timer(1000, 1000);
    this.timerSubscription = timer.subscribe((t:any) => {
        this.timerExecuted();
    });
}    

private timerExecuted(): void {
     var currentDate = new Date();
     currentDate.setHours(currentDate.getHours() - 2);  //subtract 2 hours or 120 minutes from current date
     this.lastActivityTime = currentDate;
}

ngOnDestroy() {
    //unsubscribe the subscription in ngDestroy
    if (this.timerSubscription != null)
        this.timerSubscription.unsubscribe();
}

lastActivityTime wird nach jeder Sekunde aktualisiert und Sie können es in Ihrer Vorlage leichter zum Vergleichen verwenden, wie

<div class="show_member_line">
  {{member.membername}} 
  <div *ngIf="member.lastactivity > lastActivityTime" class="status_online"></div>
  <div *ngIf="member.lastactivity < lastActivityTime" class="status_offline"></div>
</div>