2016-05-09 1 views
1

AG-グリッドヘッダーテンプレート内NGクリック:私は、ヘッダーのテンプレートを定義している

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

そして、私はまた私のコントローラに機能を持っている:

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

は、どのように私はAG-グリッドにすることができますmy $ scopeからdeleteColumn()を呼び出しますか?今すぐクリックすると親スコープからメソッドが呼び出されないためです。

+0

あなたがテンプレートをコンパイルする必要があります。

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でヘッダーの角度コンパイルしているします。何か$ compile(cellHtml)($ scope)のようなもの – olysachok

+0

@ x-act headerCellTemplate関数でコンパイルすべきですか?または、jQueryからこのhtmlを取得してから$コンパイルする必要がありますか? –

答えて

0

残念ながら、headerTemplatesの角度コンパイルはサポートされていません。 headerCellRendererを使用する必要があります。

これは動作するはずです:

$scope.gridOptions = 
{ 
    ... 
    headerCellRenderer: headerCellRendererFunc, 
    angularCompileHeaders: true, 
    ... 
} 
関連する問題