私はAngular2 +が初めてで、リアルタイムでページを作成する必要があります。私のコンポーネントをロードするとき、私はObservableを使ってサービスを呼び出し、私のモデルのngForで使用する変数に結果を保存します。ロード後、毎分データをリフレッシュする必要があり、変更されたデータを修正する必要があります。Observableを使用してObservableを使用して、リアルタイムのページのように角度2のレンダーDOMなしで変数を更新するには
誰でもこれを行う方法を知っていますか？
をこのタスクを達成するためにRxJs観測でsocket.io結合する必要があると思います。
サービス
poll{
return Observable
.interval(1000)
.flatMap(() => {
//ur Observable from HTTP call
return Observable
});
}
コンポーネント： - 最新の値を割り当てる前に、それはtrackBYが不必要に レンダリング割り当て
this.service.poll().subscribe(
data => {
// if data same don't update
if((JSON.stringify(this.models) === JSON.stringify(data) === false)){
this.models = data;
}
}
);
HTMLコード
< li *ngFor="let model of models ;trackBy: trackByFn " >
{{model}}
<li>
を停止します不必要に避けることができます値を比較してみてくださいmore info https://angular.io/docs/ts/latest/api/common/index/NgFor-directive.html
ありがとうございます、この解決策は私に働きます... –
私は観察可能な間隔と主題で同様の種類のアプリケーションを開発しました。もう1つは疑問です。データが非常に頻繁に変わるのは、以前のデータとコンポーネントのサブスクリプション内の最新のデータを比較する場合です。モデルの不必要な更新を減らします。あなたのアプリケーションを開発した後、あなたの経験を投稿してみてください。 – CharanRoot
trackByを使用してDOMを再作成せずに画面を更新できます。今私はいくつかのスタイルCSSを適用するためにどのような情報が変わったのかを知る必要があります。いいえ、私はそれを行う最良の方法を発見する必要があります。 –
私はあなたがそれを毎分のポーリングを行います観察可能な間隔で始めることができます
チェックthis
あなたはsocket.ioを使わずにこれを行う別の方法を知っていますか？ –
https://www.quora.com/What-are-some-alternatives-to-socket-io –
何か試しましたか？任意のコード？ – Hoyen