アイテムのリスト (複数のメッセージを含むチャットと考えてください) が与えられた場合、moment.jsを使用して、各アイテムの相対的な時間 (作成からなど) を表示したいと考えています。
各アイテムには独自のコンポーネントがあり、次のコードを使用して相対時間が表示されます。
get timeFromNow(): string {
return moment(this.pageLoaded).fromNow(); // pageLoaded is a JS Date
}
pageLoaded問題は、元の入力 (上記の例) が変更されないため、コンポーネントが相対時間の表示を更新しないことです。
私の質問は次のとおりです。そのようなシナリオに対処するためのベスト プラクティスはありますか? 現在、再レンダリングをトリガーするためにmarkForCheckofを使用しています。ChangeDetectorRefただし、これがパフォーマンス的に良い方法であるかどうかはわかりません。
Stackblitzで簡単なデモを作成しました。デモでは、前述を使用しmarkForCheckて更新をトリガーします。