ng-click不适用于datatable ajax数据

Question

我正在使用datatable jquery来生成表格，并在数据表中使用AJAX。

我的表格已成功生成，但是在该列中有一个ng-click功能，当我点击它时它不起作用我的意思是它不会进入控制器。

输出是： 这是我的代码：

控制器：

'use strict';

app.controller('AdminController', ['$scope', '$http', '$state','sessionService', function($scope, $http, $state, sessionService) {
    $scope.authError = null;
    $scope.loading = false ; 
    $scope.tbOptions = {
        data: [],
        sAjaxSource: 'api/api.php?type=admin_users',
        aoColumns: [
            { mData: 'no' },
            { mData: 'name' },
            { mData: 'email' },
            { mData: 'role' },
            { mData: 'action' }
        ],
        aoColumnDefs: [
            {
                aTargets: [4],
                mRender: function (data, type, full) {
                    var tbAction = '';
                    tbAction += '<button type="button" ng-click="editAdmin('+full.id+')" class="btn btn-xs btn-default"><i class="fa fa-pencil"></i></button>';
                    tbAction += '&nbsp&nbsp;&nbsp;';
                    tbAction += '<button type="button" ng-click="deleteAdmin('+full.id+')" class="btn btn-xs btn-danger"><i class="fa fa-times"></i></button>';
                    return tbAction;
                }  
            }
        ]
    };
    $scope.editAdmin = function(id){
        console.log('S-'+id);
    }

    $scope.deleteAdmin = function(id){
        console.log('S-'+id);
    }
}]);

HTML视图：

<div class="bg-light lter b-b wrapper-md">
  <h1 class="m-n font-thin h3">Admin User List</h1>
</div>
<div class="wrapper-md">
  <div class="panel panel-default">
    <div class="panel-heading">
      Admin User
    </div>
    <div class="table-responsive">
      <table ui-jq="dataTable" ui-options="tbOptions" class="table table-striped b-t b-b" ng-controller="AdminController" ajax-datatable>
        <thead>
          <tr>
            <th  style="width:20%">No.</th>
            <th  style="width:25%">Name</th>
            <th  style="width:25%">Email</th>
            <th  style="width:15%">Role</th>
            <th  style="width:15%">Action</th>
          </tr>
        </thead>
        <tbody>
        </tbody>
      </table>
    </div>
  </div>
</div>

指令：

'use strict';

angular.module('app')
  .directive('ajaxDatatable', function ($compile) {
  return {
    restrict: 'A',
    replace: true,
    link: function (scope, ele, attrs) {
      scope.$watch(attrs.dynamic, function(html) {
        ele.html(html);
        $compile(ele.contents())(scope);
      });
    }
  };
});

任何帮助都将不胜感激。

谢谢