Angularjs ng在ag网格单元内单击不起作用

我正在使用ag网格，我需要在一个单元格中添加一些自定义链接，并希望在其上调用ng click函数。这是我的密码

var columnDefs =[
                {headerName: "ID", field: "id"},
                {headerName: "Template Name", field: "user_template_name"},
                {headerName: "Screen", field: "screen_name"},
                {headerName: "Last Uploaded", field: "created_at"},                            
                {headerName: "Manage", cellRenderer: createCustomLinks }
              ];
  var gridOptions = {
                        angularCompileRows:true,
                        columnDefs: columnDefs,
                        rowData: null,
                        enableSorting: true,
                        enableColResize: true,
           };
 var gridDiv = document.querySelector('#myGrid');
 new agGrid.Grid(gridDiv, gridOptions);             
 gridOptions.columnApi.setColumnVisible('id', false);
 gridOptions.api.sizeColumnsToFit();

 function createCustomLinks(params) {
            var cellHtml = '<a ng-click="openTemplateID('+params.data.id+')">Open</a>';

            var domElement = document.createElement("span");
                domElement.innerHTML = cellHtml;

               params.$scope.openTemplateID = function(id){
                  console.log(id);
               }

            return domElement;
          };

var columnDefs=[
{标题名：“ID”，字段：“ID”}，
{headerName:“模板名称”，字段：“user\u Template\u Name”}，
{标题名称：“屏幕”，字段：“屏幕名称”}，
{headerName:“上次上传”，字段：“创建时间”}，
{headerName:“管理”，cellRenderer:createCustomLinks}
];
变量gridOptions={
angularCompileRows：没错，
columnDefs:columnDefs，
rowData:null，
enableSorting:true，
enableColResize:true，
};
var gridDiv=document.querySelector（“#myGrid”）；
新的agGrid.Grid（gridDiv，gridOptions）；
gridOptions.columnApi.setColumnVisible（'id'，false）；
api.sizeColumnsToFit（）；
函数createCustomLinks（参数）{
var cellHtml='打开'；
var domeElement=document.createElement（“span”）；
doElement.innerHTML=cellHtml；
参数$scope.openTemplateID=函数（id）{
console.log（id）；
}
返回元素；
};

我犯了以下错误

TypeError: _this.$scope is null
setTimeout(function () { _this.$scope.$apply(); }, 0);  
ag-grid.js (line 7415, col 39)
Error: this.parentScope is null
RenderedRow</RenderedRow.prototype.createChildScopeOrNull

TypeError:\u此.$scope为空
setTimeout（函数（）{u this.$scope.$apply（）；}，0）；
ag-grid.js（第7415行，第39列）
错误：此.parentScope为空
RenderDrow在使用ag栅格和angularJS时，不要执行以下操作：

 var gridDiv = document.querySelector('#myGrid');
 new agGrid.Grid(gridDiv, gridOptions);   

而是在HTML中使用

<div ag-grid="gridOptions"></div> // don't forget having grdOptions bind to $scope

我曾经有过这个问题。我们需要在网格选项中定义它。将angularCompileRows设置为true为我解决了此问题

$scope.gridOptions = {
        columnDefs: $scope.columnDefs,
        rowData: $scope.rowData,
        // all other options 
        angularCompileRows: true
    };

小心，如果这样做，您将失去ag grid的所有性能优势。
$scope.gridOptions = {
        columnDefs: $scope.columnDefs,
        rowData: $scope.rowData,
        // all other options 
        angularCompileRows: true
    };