0

で、httpを使用してサーバーからデータを取得していますservice.ts：

getAllCursenValue():Observable<Cursen[]>{
    let cursen$ = this.http
      .get(this.baseUrl,{headers: this.getHeaders()})
      .map(mapCursen);
    return cursen$;
}

function mapCursen(response:Response):Cursen[]{
    return response.json().map(toCursen);
}

function toCursen(r:any):Cursen{
    let cursen = <Cursen>({
        id_boitier:r.id_boitier,
        id_phase:r.id_phase,
        date:new Date(r.date),
        power:r.power,
        voltage:r.voltage,
        current:r.current,
        phase:r.phase,
        thd:r.thd,
        acc:r.acc,
        flags:r.flags,
        added_info:r.added_info
    });
    return cursen;
}

私のコンポーネントでは、ハイチャートを使用してこのデータを表示したいのですが、問題は、ボタンをクリックしてもチャートに何も表示されないことです。クリックすると、データはまだ準備ができていないと思います

component.ts :

getCursenByDateTest(){
 this.cursenService
   .getCursenValueByDateTest("2016-7-30","2016-7-31")
   .subscribe(p => {
     this.cursens = p;
     console.log(p)
     console.log(this.cursens.length);
   });
   }

ボタンをクリックしたときの方法: コンソールは、オブジェクトを印刷する前に「GGGGG」と「PPPPP」を印刷します。

 ChartLine(){

this.getCursenByDateTest();
  console.log("GGGGGGGGGGGGGG");
  console.log("PPPPPPPPPPPPPPPPPP",this.finaldate1);

  this.options1 = {
    chart: {
      type: 'area'
    },
    title: {
      text: 'Area chart with negative values'
    },
    xAxis: {
      categories: this.voltagesMax
    },
    credits: {
      enabled: false
    },

    series: [{
      name: 'John',
      data: this.voltagesMax
    }]
  };
  }

チャートに送信する前にすべてのデータを取得するにはどうすればよいですか?

4

1 に答える 1

0

オブザーバブルをサブスクライブすると、コールバック関数を提供できます。以下の例では、 と呼んでいCompleteGetます。 CompleteGet()エラーではなく、データを返す get が成功した場合にのみ呼び出されます。コールバック関数には、必要なフォローオン ロジックを配置します。

getCursenByDateTest(){
 this.cursenService
   .getCursenValueByDateTest("2016-7-30","2016-7-31")
   .subscribe(p => {
     this.cursens = p;
     console.log(p)
     console.log(this.cursens.length);
   },
   error => this.error = error,
   () => this.CompleteGet());
}

completeGet() {
   // the rest of your logic here - only executes on obtaining result.
}
于 2016-08-31T10:46:28.240 に答える