谁能解释为什么 this.agGrid 在 ngOnChanges 方法中未定义?它在 onGridReady 中设置,在 ngOnChanges 方法之前执行。
在我的 component.ts 文件中
private onGridReady(agGrid) {
this.agGrid = agGrid // set property
console.log(1, this.agGrid)
}
ngOnChanges(changed) {
console.log(2, this.agGrid) // property undefined
}
控制台输出:
1 Object { type: "gridReady", api: {…}, columnApi: {…} }
2 undefined
知道为什么 this.agGrid 没有在 ngOnChanges 中定义吗?
编辑(显示如何调用 onGridReady):
html
<ag-grid-angular
class="ag-theme-balham"
style="width: 100%; height: 100%;"
[gridOptions]="gridOptions">
</ag-grid-angular>
更多的 ts 文件
private createGridOptions() {
const gridOptions = {};
gridOptions['onGridReady'] = this.onGridReady;
return gridOptions;
}
ngOnInit() {
this.gridOptions = this.createGridOptions();
}
您正在直接分配功能。这实际上与onGridReady
在 a 内部调用相同function() { }
。在 a 中function() { }
,关键字this
指的是函数本身。
您不是在更新agGrid
组件上的属性 - 您是在函数本身上设置属性。
如果你想引用外部作用域——在这种情况下是组件——你应该使用箭头函数。
gridOptions['onGridReady'] = (agGrid) => this.onGridReady(agGrid);
演示:https : //stackblitz.com/edit/angular-ay79o3
在这个演示中,按钮 1 永远不会name
在组件上设置属性,因为它是如何调用的。按钮 2 将name
在组件上设置属性,因为它是在箭头函数内调用的。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句