httpリクエストが終了したときに角2が通知されます

Question

テンプレートにngForという配列をリンクしてテーブルを作成しています。

しかし、配列がHTTP要求から非同期的に移入されるので、新しいデータがリモートサーバーから配列にロードされたときにレンダリングの遅延が発生しているため、テーブルが再投入されている間に '点滅'が発生します。

配列をローカルに再配置すると、これは起こりません。そのため、各アイテムがオブザーバブルから配列にロードされるときに、テーブルが更新されていると仮定します。

テンプレートにレンダリングされる前に、データが完全に読み込まれるまで待つことができます。私が試みてきたアプローチは、データを一時配列にロードし、一時配列が完全に移入されたときに通知を受け、それをテンプレートにリンクされた配列に追加することです。

サブスクリプションの3番目のパラメータは完全なものであると考えられていますので、私はそれを使用しようとしました。下記を参照してください...

this.dataService.callApi() 
    .subscribe(
     response => this.arrayTemp = response.content, 
     error => this.response = error.text(), 
     () => this.array = arrayTemp 
    ); 

はしかし、これは私が期待通りに動作していないと私はまだ、レンダリングの問題を見ています。何か案は？おかげさまで

Answer 1

サブスクリプション内でブール値「ロード済み」を使用します。

デフォルトでは 'loaded'をfalseに設定し、 'ngIf = "loaded"テーブルを使用してサブスクリプション内に設定します。

this.loaded = false; 
this.dataService.callApi() 
    .subscribe(
     (response) => { 
      this.arrayTemp = response.content; 
      this.loaded = true; 
     } 
    );