jQuery DataTable TypeError： 无法设置未定义的属性"destroy"

Question

<script>
  $('#messagesTable').DataTable({});
</script>
<table id="messagesTable" datatable="ng" class="table table-sm" style="color:black">
  <!--some code-->
</table>

这是我在 HTML 中的代码

我在浏览器控制台中遇到错误： angular.js:11594 TypeError: Cannot set property 'destroy' of undefined

有什么想法吗？

Answer 1

DataTables 需要一个格式正确的表。它必须包含<thead>和<tbody>标记。

$(document).ready(function() {
  $('#messagesTable').DataTable({});
});

<table id="messagesTable" datatable="ng" class="table table-sm" style="color:black">
  <!--some code-->
  <thead>
    <tr>
      <th>col one</th>
      <th>col two</th>
    </tr>
  </thead>
  <tbody>
    <td>data one</td>
    <td>data two</td>
  </tbody>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>