我使用angular2-highcharts创建饼图,我使用输入将数据传递给图表。但是组件构造函数上的输入为undefined
,并且不显示图表。
我已经在使用*ngIf
了,实际上,如果我将输入设置为undefined
并显示何时传递一些数据,则会隐藏div。但是图表仍然没有显示。
@Component({
selector: 'pie-chart',
directives: [CHART_DIRECTIVES],
template: `
<chart [options]="options"></chart>
`
})
export class PieChartComponent {
options: HighchartsOptions;
@Input() pieChartData : Array<{name: string, y: number}>
constructor () {
this.setChartOptions();
}
setChartOptions() {
console.log("creating pie "+ this.pieChartData) <- undefined
this.options = {
...,
series: [{
data: this.pieChartData
}]
};
}
}
用法:
<div *ngIf="pieChartData" >
<pie-chart [pieChartData]="pieChartData"></pie-chart>
</div>
提前谢谢。
答案 0 :(得分:0)
实现OnInit解决了in this answer所述的问题。
export class PieChartComponent implements OnInit {
options: HighchartsOptions;
@Input() pieChartData : Array<{name: string, y: number}>
ngOnInit () {
this.setChartOptions();
}
...
}