angularJs 的数据表显示没有数据错误?
Datatable with angularJs shows no data error?
我想在 angularjs 中使用数据 table。我已经编写了指令和数据 table 来初始化和显示 table 中的行。
搜索或过滤时,table 错误消息中没有显示数据。
指令代码是
"use strict";
invoiceApp.directive('itemTable', function () {
return {
restrict: 'E',
replace: true,
templateUrl: 'app/components/item/item_table.html',
link: function (scope, table) {
table.dataTable();
}
}
})
模板是,
<table my-table id="dt_basic" class="table table-bordered table-hover" width="100%">
<thead>
<tr>
<th class="text-center" width="10">
<input type="checkbox" name="checkbox-inline" id="slt_all">
</th>
<th data-class="expand">Name</th>
<th data-hide="phone">Description</th>
<th data-hide="phone">Unit</th>
<th>Rate</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in items">
<td class="text-center"><input type="checkbox" checked="checked" name="checkbox-inline"></td>
<td>{{item.name}}</td>
<td>{{item.description}}</td>
<td>{{item.unit}}</td>
<td>AED {{item.rate}}</td>
</tr>
控制器是,
'use strict';
invoiceApp.controller('itemController', ['$scope', 'ItemService', function ($scope, ItemService) {
$scope.items = //datas
}]);
为什么会这样?
无需创建新指令,只需添加 datatable="
使用此 angular 数据表模块
HTML:
<table datatable="" class="row-border hover">
<thead>
<tr>
<th>ID</th>
<th>First name</th>
<th>Last name</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Foo</td>
<td>Bar</td>
</tr>
<tr>
<td>123</td>
<td>Someone</td>
<td>Youknow</td>
</tr>
<tr>
<td>987</td>
<td>Iamout</td>
<td>Ofinspiration</td>
</tr>
</tbody>
</table>
JS :
angular.module('showcase', ['datatables']);
在数据中使用 "ng"tables="" 指令..
像这样: datatables="ng" click here to see an example 这解决了我的问题
因为我正在使用 ng repeat 在 table
中显示数据
我想在 angularjs 中使用数据 table。我已经编写了指令和数据 table 来初始化和显示 table 中的行。 搜索或过滤时,table 错误消息中没有显示数据。
指令代码是
"use strict";
invoiceApp.directive('itemTable', function () {
return {
restrict: 'E',
replace: true,
templateUrl: 'app/components/item/item_table.html',
link: function (scope, table) {
table.dataTable();
}
}
})
模板是,
<table my-table id="dt_basic" class="table table-bordered table-hover" width="100%">
<thead>
<tr>
<th class="text-center" width="10">
<input type="checkbox" name="checkbox-inline" id="slt_all">
</th>
<th data-class="expand">Name</th>
<th data-hide="phone">Description</th>
<th data-hide="phone">Unit</th>
<th>Rate</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in items">
<td class="text-center"><input type="checkbox" checked="checked" name="checkbox-inline"></td>
<td>{{item.name}}</td>
<td>{{item.description}}</td>
<td>{{item.unit}}</td>
<td>AED {{item.rate}}</td>
</tr>
控制器是,
'use strict';
invoiceApp.controller('itemController', ['$scope', 'ItemService', function ($scope, ItemService) {
$scope.items = //datas
}]);
无需创建新指令,只需添加 datatable="
使用此 angular 数据表模块
HTML:
<table datatable="" class="row-border hover">
<thead>
<tr>
<th>ID</th>
<th>First name</th>
<th>Last name</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Foo</td>
<td>Bar</td>
</tr>
<tr>
<td>123</td>
<td>Someone</td>
<td>Youknow</td>
</tr>
<tr>
<td>987</td>
<td>Iamout</td>
<td>Ofinspiration</td>
</tr>
</tbody>
</table>
JS :
angular.module('showcase', ['datatables']);
在数据中使用 "ng"tables="" 指令.. 像这样: datatables="ng" click here to see an example 这解决了我的问题 因为我正在使用 ng repeat 在 table
中显示数据