javascript - ng-click 在 ag-grid 标题模板内

Question

我已经定义了标题模板:

  headerCellTemplate: function () {
            var eCell = document.createElement('span');
            eCell.innerHTML = '<span ng-click="deleteColumn()" class="glyphicon glyphicon-minus"></button></span>';
            return eCell;
        }

我的 Controller 也有功能:

$scope.deleteColumn = new function(){
    console.log("test");
}

如何让ag-grid从我的$scope调用deleteColumn()？因为现在单击并不是从父作用域调用方法。

Answer 1

不幸的是，不支持 headerTemplates 中的 Angular 编译。您必须使用 headerCellRenderer。

这应该有效:

headerCellRendererFunc: function (params) {
    // set the right scope for the grid params
    params.$scope.deleteColumn = $scope.deleteColumn;

    var eCell = document.createElement('span');
    eCell.innerHTML = '<span ng-click="deleteColumn()" class="glyphicon glyphicon-minus"></button></span>';
    return eCell;
}

还要确保您在 gridOptions 中启用了标题的 Angular 编译:

$scope.gridOptions =
{
    ...
    headerCellRenderer: headerCellRendererFunc,
    angularCompileHeaders: true,
    ...
}