ag Grid：自定义标题列绑定不起作用答案

【问题标题】：agGrid : custom header column binding not workingag Grid：自定义标题列绑定不起作用
【发布时间】：2016-07-27 05:13:13
【问题描述】：

我目前正在尝试在 agGrid 标头中添加一个角度指令。为此，我在 headerCellRenderer 中传递了一个函数，如下所示：

我的网格选项：

this.columnDefs = [
    {headerName: "Height", field: "rowHeight"},
    {headerName: "Athlete", field: "athlete", width: 180},
    {headerName: "Age", field: "age", width: 90},
    {headerName: "Country", field: "country", width: 120},
    {headerName: "Year", field: "year", width: 90}
];
this.gridOptions = {
    columnDefs: this.columnDefs,
    rowData: null,
    //enableSorting: true,
    headerHeight: 60,
    //enableFilter: true,
    enableColResize: true,
    angularCompileRows:true,
    angularCompileHeaders: true,
    headerCellRenderer: (params) => 
        {return   this.headerCellRendererFunc(params);},
    rowSelection: 'multiple',
};

我的函数定义如下：

headerCellRendererFunc(params) {
    const headerColDef = params.colDef;
    headerColDef.name =  headerColDef.headerName;
    headerColDef.isMetadata = false;
    return '<header column="headerColDef"></header>';
}

结果我的指令被渲染但“列”绑定是空的，我不明白我必须如何将对象传递给我的指令。

有什么想法吗？谢谢！

【问题讨论】：

奇怪的是，当我传递一个虚拟值时：''; “ca”是一个数字，这个数字实际上是我的指令......

标签： angularjs angularjs-directive ag-grid

【解决方案1】：

如果这可以帮助任何人，我刚刚理解了我的错误：params 参数有一个范围，这是传递给指令的那个，所以我所要做的就是在范围内传递我的对象以使其工作！

 params.$scope.column = headerColDef;

html 看起来像这样：

return '<header column="column"></header>';

【讨论】：

【解决方案2】：

设置ag-grid gridOptions属性angularCompileHeaders: true(默认为false)

试试吧！这对我有用。

参考：https://www.ag-grid.com/javascript-grid-properties/index.php

【讨论】：