全部 我按照 http://bazalt-cms.com/ng-table/example/4 的说明在 ng-table 中创建了一个过滤框
我的代码与示例相同: 在 html 中创建过滤器:
<table ng-table="tableParams" show-filter="true" class="table">
<tr ng-repeat="user in $data">
<td data-title="'Name'" filter="{ 'name': 'text' }">
现在我们可以看到布局了:
但我不想要表格中的过滤框,像这样:
文件管理器在 table 上方 我的过滤框代码:
<input type="text" ng-model="filter.name" />
<table ng-table="tableParams" show-filter="false" class="table">
<tr ng-repeat="user in $data">
<td data-title="'Name'" filter="{ 'name': 'text' }">
{{user.name}}
</td>
... 使用 ng-model="filter.name"绑定(bind),但不起作用...
有没有办法实现我的想象?
最佳答案
帕姆错了。你永远不应该在 ngtable 或任何已经完成它的组件之后进行过滤。否则,你会有意想不到的事情发生。
只需修改您的表参数并通过引用您的过滤器对象进行绑定(bind):
$scope.filter = {name: 'T'};
$scope.tableParams = new ngTableParams({
page: 1, // show first page
count: 10, // count per page
filter: $scope.filter
}, {
total: data.length, // length of data
getData: function($defer, params) {
// use build-in angular filter
var orderedData = params.filter() ?
$filter('filter')(data, params.filter()) :
data;
$scope.users = orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count());
params.total(orderedData.length); // set total for recalc pagination
$defer.resolve($scope.users);
}
});
并删除 tr 中的过滤器内容
<input type="text" ng-model="filter.name"/>
<table ng-table="tableParams" class="table">
<tr ng-repeat="user in $data">
<td data-title="'Name'" >
{{user.name}}
</td>
<td data-title="'Age'">
{{user.age}}
</td>
</tr>
</table>
通过这种方式,数据在数据重新加载时被过滤,而不是在数据显示时被过滤。您的 $scope.filter 绑定(bind)在 UI 上并由 ngTable $watched。
关于javascript - 如何从 ng-table 中定义过滤框?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25440978/