Javascript angular2组件生命周期

我像这样将一个数组传递到我的组件中

 <app-bar-chart-demo [chartLabelObject]="['2006', '2007', '2008', '2009', '2010', '2011', '2012']"></app-bar-chart-demo>

然后我将一个变量设置为它的值，如下所示

    export class BarChartDemoComponent {
     ...
      barChartLabels:string[] = this.chartLabelObject;
...//and doing stuff with it
}

但是，在我使用它时，它似乎是“未定义”的。如果我记录它的值以响应按下的按钮，我会看到它已设置，如果我将它放在“导出类”的开头或“构造函数”的下面，则它未设置

---

我应该在哪里设置“barChartLabels:string[]”？

对输入属性的每次更改都会触发对组件上的

ngOnChanges

的调用。这是您应该设置

barChartLabels

属性的位置

@组件({
...
输入：['chartLabelObject']
})
导出类BarChartDemoComponent实现OnChanges{
条形图标签：字符串[]；
构造函数（）{}
ngOnChanges（更改）{
如果（更改[“chartLabelObject”]）{
this.barChartLabels=this.chartLabelObject；
}
} 
}

您还可以稍微清理一下您的逻辑，只需使用

@input

装饰器将输入直接映射到您的输入，如下所示：

@组件({
...
})
导出类BarChartDemoComponent{
@输入（'chartLabelObject'）条形图表标签：字符串[]；
构造函数（）{}
}

    export class BarChartDemoComponent {
     ...
      barChartLabels:string[] = this.chartLabelObject;
...//and doing stuff with it
}