ng2-chartsは更新されたラベルを表示せず、データのみ

Question

ng2-chartsパッケージを使用する角度（2）のアプリケーションがあります。私のコンポーネントの1つに、サーバーから照会するデータを含む円グラフが表示されます。成分を以下に示す：

export class PieChartComponent implements OnInit { 
    data: Array<number> = []; 
    labels: Array<string> = ['', '', '', '']; 
    private line: string; 
    private department: string; 

    constructor(public dataService: LineService, private route: ActivatedRoute) { 
    this.route.params.forEach((params: Params) => { 
     this.department = params['dep']; 
     this.line = params['id']; 
    }); 
    } 

    ngOnInit() { 
    this.dataService.getLineTAL(this.department, this.line).forEach(result => { 
     this.data = result.map(val => val.val); 
     this.labels = result.map(val => val.tag); 
    }); 
    }  
} 

とHTML：

<div style="display: block"> 
    <canvas baseChart [data]="data" [labels]="labels" [chartType]="'pie'" (chartClick)="chartClicked($event)" width="1" height="1"></canvas> 
</div> 

デバッガを実行する場合、私はthis.labelsが正しくの値でなければならない文字列の配列を含むように更新されていることを確認することができグラフのデータラベル。しかし、グラフが正しいデータをレンダリングし、ない値を取得私の上にホバーのように：

デフォルトの色はすべてグレーに変更されている理由を、私もわかりませんか？私はそれを自分のコンポーネントに振りかけるまで、このロジックとUIはうまく動作しています。

他の質問でも指摘されているように、サービスコールの前に@ViewChild(BaseChartDirective) chart: BaseChartDirective;の図があるthis.chart.ngOnChanges({});を追加しようとしました。また、結果マッピングの最後にthis.labels = this.labels.slice();を試して強制的にリフレッシュを試みましたが、いずれも助けになりませんでした。

更新：

コメントで述べたように、ngAfterViewInitイベントで、チャートオブジェクトは、正しいデータとラベルプロパティ（アレイ）を含みます。しかし、まだ適切に表示されていません。

Answer 1

NG2-チャートになるとの問題あなたは、時間（ラベルとデータ）の両方の性質を更新しようとすると、簡単な解決策は、直接データを設定することで、0タイムアウト内部ラベル：付き

ngOnInit() { 
    this.dataService.getLineTAL(this.department, this.line).forEach(result => { 
     this.data = result.map(val => val.val); 
     setTimeout(() => {this.labels = result.map(val => val.tag)}; 
    }); 
    } 

これは、あなたがする必要があります。