Angular2 Update ng2-charts con etiquetas

Estoy empezando a trabajar estos días conAngular2y tengo una pregunta con el marcong2-charts.

Aquí está micomponente.ts código:

import { Component } from '@angular/core';
import { ChartsModule } from 'ng2-charts';
import { PredictionService } from './prediction.service'

@Component({
  selector: 'prediction-result-chart',
  templateUrl: './predictionResultChart.component.html'
})

export class PredictionResultChartComponent{

  public pieChartLabels:string[] = [];
  public pieChartData:number[] = [];
  public pieChartType:string = 'pie';
  public JSONobject = {}

  constructor(private predictionService: PredictionService){
    this.getPredictions();
  }

  public getPredictions() {
    this.predictionService.getPredictions('hello').do(result => this.populateChart(result)).subscribe();
  }

  public populateChart(obj): void{
    let labels:string[] = [];
    let data:number[] = [];
    for (var i = 0; i < obj.predictions.length; i++)
    {
      labels.push(String(obj.predictions[i].class));
      data.push(obj.predictions[i].percentage);
    };
    this.pieChartData = data;
    this.pieChartLabels = labels;
  }

  public chartClicked(e:any):void {}
  public chartHovered(e:any):void {}

}

loscomponente.html&nbsp;código:

<div style="display: block">
  <canvas baseChart
      [data]="pieChartData"
      [labels]="pieChartLabels"
      [chartType]="pieChartType"
      (chartHover)="chartHovered($event)"
      (chartClick)="chartClicked($event)"></canvas>
</div>

El código de servicio:

import { Injectable } from '@angular/core';
import { Http, Response, Headers } from '@angular/http';

import { Observable }     from 'rxjs/Observable';
import 'rxjs/add/operator/map';


@Injectable()
export class PredictionService {

  private baseUrl: string = 'http://localhost:8080/predict/';
  constructor(private http : Http){
  }

  getPredictions(text :string) {
    return this.http.get(this.baseUrl + text).map(res => res.json());
  }

}

Con los códigos anteriores, esto es lo que tengo, una tabla sin ningún color:

De hecho, cuando examiné profundamente mi código, el componente HTML tomó las variables al principio y luego las actualizó. Entonces, cuando las etiquetas están vacías, incluso si agrego algunas etiquetas, se agregarán como indefinidas. Así que tengo un gráfico con los valores correctos pero no con las etiquetas correctas. Todo marcado como indefinido.

Y si inicio las etiquetas al principio, tendré una buena tabla de colores con los valores correctos

Entonces mis preguntas son:

¿Cómo cargar los datos y luego renderizar el componente HTML?

¿Hay alguna forma de representar el componente chart.js sin datos y actualizarlo con las etiquetas y datos correctos?

Cualquier ayuda es necesaria, gracias.