Question

我在本地做了一个web（angular 5）页面主机，我使用datatable（jquery）在html上添加了一些额外的功能（比如sort，filter，search..etc）。当我第一次尝试时，数据表按照我的预期工作，但是当我重新加载页面时，它的ui也会发生变化，那么所有的数据表函数都不再起作用......它似乎是随机出现的。所以我清除了所有cookie并禁用了使用cookie的页面，但结果仍然相同。我还尝试使用控制台日志来查看$（＆＃39;＃myTable＆＃39;）。DataTable（）;我重新加载页面时运行，它实际上每次重新加载页面时运行。我不知道哪里出了问题。注意：我使用localhost / 3000将我的页面重定向到\ books页面。这是我的示例索引文件代码：

    <!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>QnAlist</title>
  <base href="/">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">

  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.css">

  <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.js"></script>

</head>
<body>

  <app-root></app-root>

  <script>
  $(document).ready(function () {
    $('#myTable').DataTable();
  });



</script>


</body>
</html>

这是我的图书组件html代码：

<div class="container">
  <h1 style="text-align: center">QnA List</h1>




  <table  class="display" id = 'myTable' >
    <thead>
      <tr>
        <th> Question </th>
        <th> Answer </th>
        <th> Date </th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let book of books">
        <td>{{ book.question }}</td>
        <td>{{ book.answer }}</td>
        <td>{{ book.timestamp }}</td>
      </tr>
    </tbody>
  </table>

</div>

Answer 1

我找到了解决它的方法....我找不到答案，所以我只是停止使用jquery表，并使用primeng数据表。它按照我的预期工作。

有时jQuery Datatable正在工作，有时它不是吗？

1 个答案: