使用AngularJS的数据表中的单元格按钮

我正在使用angularjs建立一个网站，我从网络服务获取数据。 我需要将该数据填充到数据表中，并为每一行创建一个编辑按钮。 经过一番调查后，我想出了这个

问题是ng-click不起作用可能是因为我需要编译注入表格单元格的html。 我已经尝试了几种方式，但不幸的是我仍然是一个非常新的角度，我似乎不明白我是如何做到这一点。 我真的需要帮助。

这是我的指示：

dialogApp.directive('myTable', function ($compile) { return { restrict: 'E, A, C', link: function (scope, element, attrs, controller) { var dataTable = element.dataTable(scope.options); scope.$watch('options.aaData', handleModelUpdates, true); function handleModelUpdates(newData) { var data = newData || null; if (data) { dataTable.fnClearTable(); dataTable.fnAddData(data); } } }, scope: { options: "=" } };}); 

控制器：

 dialogApp.controller('DataTableTestController', ['$scope', function($scope){ $scope.coisas = "coisas"; $scope.botaoEdit = function(a){ console.log(a); }; $scope.options = { "sDom": 't', "bStateSave": true, "bPaginate": false, "bLengthChange": false, "bFilter": true, "bSort": true, "bInfo": true, "bAutoWidth": false, "sPaginationType": "full_numbers", aoColumns: [{ "sTitle": "name" }, { "sTitle": "price" }, { "sTitle": "category" }, { "sTitle": "action" }, null], "aaSorting": [[ 0, "asc" ]], aoColumnDefs: [ { "bSortable": true, "aTargets": [0] }, { "bSortable": false, "aTargets": [1,2,3,4] } ], bJQueryUI: true, aaData: [] }; var dbStuff = [ { "name": "Stuff1", "price": 10000000.00, "description": "Expensive Stuff", "wanna":"buy" }, { "name": "Stuff2", "price": 20000000.00, "description": "Oh my...", "wanna":"have money" } ] for (var key in dbStuff){ $scope.options.aaData.push([dbStuff[key].name, dbStuff[key].price, dbStuff[key].description, dbStuff[key].wanna, "test button" ]); } $scope.counter = 0; }]) 

和HTML：

   
 
 {{ coisas }}  
  

Answer 1

是的，你是对的，ng-click指令不是由angular编译的。 所以最直接的方法是使用onclick监听器：

  "test button" 

不要忘记添加引号： botaoEdit('') ，在你的小提琴中你试图访问Stuff1变量:)

最后，我认为最好的方法是使用一些网格插件或ng-repeat，这将在收到数据时为您的表构建行。 在这种方法中，行中的ng-click可以正常工作。