AngularJs 数据表插件不工作
AngularJs datatable plunker not working
我是 plunker/jsfiddle 的新手,正在尝试创建 Angular Datatable Selecting rows 的 plunker,但根据给定的教程无法正常工作。
这是我的笨蛋:https://embed.plnkr.co/1squczHPOaeHpe26zUwt/
我找不到问题。任何形式的帮助将不胜感激。
这是一个解决了您的大部分问题的更新,它们是:
- 双重使用 ng-app
- 缺少某些必需库的脚本
- 缺少模块依赖声明
- 缺少声明控制器依赖项
参见 https://plnkr.co/edit/AXaixxzdapWnQkjBp1bg?p=preview,一些更改包括:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.13/js/jquery.dataTables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-datatables/0.5.6/angular-datatables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-resource/1.6.1/angular-resource.min.js"></script>
angular
.module('showcase', ['datatables', 'ngResource'])
.controller('RowSelectCtrl', ['$compile', '$scope', '$resource', 'DTOptionsBuilder', 'DTColumnBuilder', function ($compile, $scope, $resource, DTOptionsBuilder, DTColumnBuilder) { ...
<div ng-app="showcase">
<div ng-controller="RowSelectCtrl as showCase">
<p class="text-danger">You selected the following rows:</p>
<p>
</p><pre>{{ showCase.selected | json }}</pre>
<p></p>
<table datatable="" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" class="row-border hover"></table>
</div>
</div>
我是 plunker/jsfiddle 的新手,正在尝试创建 Angular Datatable Selecting rows 的 plunker,但根据给定的教程无法正常工作。
这是我的笨蛋:https://embed.plnkr.co/1squczHPOaeHpe26zUwt/
我找不到问题。任何形式的帮助将不胜感激。
这是一个解决了您的大部分问题的更新,它们是:
- 双重使用 ng-app
- 缺少某些必需库的脚本
- 缺少模块依赖声明
- 缺少声明控制器依赖项
参见 https://plnkr.co/edit/AXaixxzdapWnQkjBp1bg?p=preview,一些更改包括:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.13/js/jquery.dataTables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-datatables/0.5.6/angular-datatables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-resource/1.6.1/angular-resource.min.js"></script>
angular
.module('showcase', ['datatables', 'ngResource'])
.controller('RowSelectCtrl', ['$compile', '$scope', '$resource', 'DTOptionsBuilder', 'DTColumnBuilder', function ($compile, $scope, $resource, DTOptionsBuilder, DTColumnBuilder) { ...
<div ng-app="showcase">
<div ng-controller="RowSelectCtrl as showCase">
<p class="text-danger">You selected the following rows:</p>
<p>
</p><pre>{{ showCase.selected | json }}</pre>
<p></p>
<table datatable="" dt-options="showCase.dtOptions" dt-columns="showCase.dtColumns" class="row-border hover"></table>
</div>
</div>