title: Angular DataTables - Cannot read property 'match'
body: <p>I am working with jQuery and Angular Datatables. I am not getting data in table.</p>
  
  <blockquote>
    <p>TypeError: Cannot read property 'match' of undefined at Object.i [as render] (angular-datatables.min.js:6)    </p>
  </blockquote>
  
  <p>These are plugins I arranged like this.</p>
  
  <pre><code>&lt;script type="text/javascript" src="js/jquery/1.11.1/jquery-1.11.1.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/angular.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/jquery.dataTables.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/angular-datatables.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>This is my Table in jsp file: all internships saved in database has to view in table. Is jquery table good to use with angularjs? </p>
  
  <pre><code>&lt;table datatable="ng" dt-options="dtOptions" cellspacing="0" width="100%"&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;Id&lt;/th&gt;
              &lt;th&gt;Title&lt;/th&gt;
              &lt;th&gt;Category&lt;/th&gt;
              &lt;th&gt;Status&lt;/th&gt;
              &lt;th&gt;Created date&lt;/th&gt;
              &lt;th&gt;Action&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tfoot&gt;
          &lt;tr&gt;
              &lt;th&gt;Id&lt;/th&gt;
              &lt;th&gt;Title&lt;/th&gt;
              &lt;th&gt;Category&lt;/th&gt;
              &lt;th&gt;Status&lt;/th&gt;
              &lt;th&gt;Created date&lt;/th&gt;
              &lt;th&gt;Action&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/tfoot&gt;
      &lt;tbody ng-repeat="internship in deatilInternships[0]"&gt;
          &lt;tr&gt;
              &lt;td&gt;&lt;span&gt;{{$index+1}}&lt;/span&gt;&lt;/td&gt;
              &lt;td&gt;&lt;span&gt;{{internship.title}}&lt;/span&gt;&lt;/td&gt;
              &lt;td&gt;&lt;span&gt;{{internship.category.name}}&lt;/span&gt;&lt;/td&gt;
              &lt;td&gt;&lt;span&gt;{{internship.status}}&lt;/span&gt;&lt;/td&gt;
              &lt;td&gt;&lt;span&gt;{{internship.appliedDate |
                          date:'d MMMM yyyy'}}&lt;/span&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;button class="btn btn-default btn-sm" data-title="Hold" data-toggle="modal" ng-click="hold(internship.id)"&gt; &lt;i class="fa fa-pause"&gt;&lt;/i&gt;
  
                  &lt;/button&gt; &lt;a href="javascript:;" class="btn btn-default btn-sm" data-title="Edit" data-toggle="modal" ng-click="update(internship.id)"&gt;
                                                                                                  &lt;i class="icon bb-edit"&gt;&lt;/i&gt;&lt;/a&gt;
  
                  &lt;button class="btn btn-default btn-sm" data-title="Delete" data-toggle="modal" ng-click="deleteinternship(internship.id)"&gt; &lt;i class="icon bb-trash"&gt;&lt;/i&gt;
  
                  &lt;/button&gt;
                  &lt;button class="btn btn-default btn-sm" data-title="View" data-toggle="modal" ng-click="viewInternship(internship.id)"&gt; &lt;i class="icon bb-view"&gt;&lt;/i&gt;
  
                  &lt;/button&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>and data is coming form backend. </p>
  
  <p>controller.js: </p>
  
  <pre><code>$scope.dtOptions = DTOptionsBuilder.newOptions().withPaginationType('full_numbers').withDisplayLength(10);
  
  var getInternships = function () {
      var data = "pageNumber=" + pageNumber + "&amp;pageSize=" + $scope.pageSize;
      internshipService.getInternships(data, function (data) {
          if (data) {
              $scope.internshipsLength = data.length;
          }
          if (data &amp;&amp; data.length &gt; 0) {
              if (latestinterships.length == 0) {
                  latestinterships = data;
              } else if (latestinterships.length &gt; 0) {
                  latestinterships = latestinterships.concat(data);
              }
              $scope.deatilInternships = [];
              var index = 0;
              for (var i = 0; i &lt; latestinterships.length; i++) {
                  if (!$scope.deatilInternships[index]) {
                      $scope.deatilInternships[index] = [];
                  }
                  $scope.deatilInternships[index].push(latestinterships[i]);
              }
          }
          $rootScope.InternshipCount = data.length;
      });
  };
  getInternships();
  </code></pre>
  
  <p>app.js: I injected dependency also as 'datatables'</p>
  
  <p>Nothing is displaying in the table.</p>