2017-01-21 7 views
3

コンポーネントにタイムスタンプのあるオブジェクトがあります。テンプレートの現在の日付を確認するにはどうすればよいですか?

私がしようとするのは、テンプレートの実行時にタイムスタンプをチェックすることです。 たとえば、メンバーのユーザーのオンライン状態を表示する。オンラインの場合は緑色の点を表示し、そうでない場合はランタイム中に赤色の点に切り替える必要があります。

<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> 

誰でもアイデアがありますか? :)私の意見では

答えて

4

より良いアプローチは

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が各秒後に更新され、あなたが

ようなあなたのテンプレートでより簡単に比較のためにそれを使用することができますようにあなたのコンポーネントにタイマーを作成することです
<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> 
関連する問題