title: ng-click not working AngularJS and dataTables
body: <p>I wrote a dataTables directive for AngularJS. Its working fine except that i trying to add an button to the row that removes an row with an ng-click.</p>
  
  <p>In my opinion is that the problem occurs because the table row doesn't now the scope.</p>
  
  <p>Can somebody help me out solving this problem.</p>
  
  <p>jsFiddle Example: <a href="http://jsfiddle.net/A5Zvh/7/" rel="noreferrer">http://jsfiddle.net/A5Zvh/7/</a></p>
  
  <p>My directive looks like this.</p>
  
  <pre><code>angular.module('DataTables', [])
  .directive('datatable', function() {
      return {
          restrict: 'E',
          transclude: true,
          replace: true,
          require: 'ngModel',
          template: '&lt;table&gt;&lt;/table&gt;',
          link: function(scope, element, attrs, model) {
              var dataTable = null,
                  options;
  
              var buttons = jQuery.parseJSON(attrs['buttons']) || null;
  
              options  = {
                      "bJQueryUI": false,
                      "sDom": "&lt;'row-fluid'&lt;'span4'l&gt;&lt;'span8 filter' &lt;'pull-right'T&gt; &lt;'pull-right'f&gt;&gt;r&gt;t&lt;'row-fluid'&lt;'span6'i&gt;&lt;'span6'p&gt;&gt;",
                      "sPaginationType": "bootstrap",
                      "oTableTools": {
                      }
                  };
  
              if(_.has(attrs, 'datatableOptions')) {
                  jQuery.extend(true, options, scope.$eval(attrs['datatableOptions']));
              }
  
              scope.$watch(attrs.ngModel, function(data) {
                  if(data &amp;&amp; _.size(data.aaData) &gt; 0 &amp;&amp; _.size(data.aoColumns) &gt; 0) {
  
                      _.extend(options, scope.$eval(attrs.ngModel))
                      dataTable = $(element).dataTable(options);
                      dataTable.fnClearTable();
                      dataTable.fnAddData(data.aaData);
                  }
              });
          }
      }
  })
  </code></pre>