Question

我使用Ionic 3创建了网站。我想创建一个如here所示的数据表。

如何将此库集成到我的网站上？
我应该做什么特定的Ionic / Angular背景？

Answer 1

您可以简单地使用Angular组件https://l-lin.github.io/angular-datatables/#/welcome
适用于角度2+，因此它适用于Ionic 3。

使用NPM安装：

npm install jquery --save
npm install datatables.net --save
npm install datatables.net-dt --save
npm install angular-datatables --save
npm install @types/jquery --save-dev
npm install @types/datatables.net --save-dev

将样式和脚本复制到/ assets文件夹并添加到index.html

 $sections = $this->model->with(['subsections.tasks.users' => function($q){
            $q->where('users.id', '=', Auth::id());
        }])->where('parent', NULL)->doesntHave('assessments')->sorted()->get();

在app.module.ts中导入依赖项

<link href="assets/css/jquery.dataTables.css" rel="stylesheet">
<script src="assets/js/jquery.js"></script>
<script src="assets/js/jquery.dataTables.js></script>

添加到导入部分：

import { DataTablesModule } from 'angular-datatables';

使用组件：将指令imports: [ ..., DataTablesModule ],添加到html标记：

datatable

将Data-table集成到Ionic 3项目中

1 个答案: