ng-clickはag-gridセル内では機能しません

Question

私はag-gridで作業しています。セルにカスタムリンクを追加し、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; 
      }; 

である私が何か間違ったことをやっている場合

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 

が私を導いてください、次のエラーを得ました。 ありがとうございます。

Answer 1

行いませんangularJSとともにAG-グリッドを使用して：

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

は、代わりにあなたのHTMLに

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

を使用するだけでこれはあなたに新しい問題をトリガする：columnApiとAPIは次のようになります実行時には未定義です。これを修正するには、onGridReadyコールバックを使用する必要があります：

gridOptions.onGridReady = function(params){ 
    gridOptions.columnApi.setColumnVisible('id', false); 
    gridOptions.api.sizeColumnsToFit(); 
}