Angularjs ng表格筛选器未筛选所有页面
我正在使用Angularjs ng表格筛选器未筛选所有页面,angularjs,ngtable,Angularjs,Ngtable,我正在使用ng table实现网格功能,但我面临两个问题 筛选器选项正在搜索当前页面数据,而不是搜索所有页面 显示错误计数及其十进制数的总计数 这是屏幕截图 JS文件如下: app.controller('AllJobListController', function ($scope, $http, $location, $filter, NgTableParams, jobService, ShareData, $sce) { loadAllJobRecords(); Ge
ng table
实现网格功能,但我面临两个问题
app.controller('AllJobListController', function
($scope, $http, $location, $filter, NgTableParams, jobService, ShareData, $sce) {
loadAllJobRecords();
GetFilterData();
function GetFilterData() {
var promiseFilterData = jobService.GetFilterData();
promiseFilterData.then(function(pl) {
$scope.FilterData = pl.data;
});
}
$scope.viewFilter = function () {
$scope.filters = {
Staff: $scope.FilterData.Staff == undefined ? null : $scope.FilterData.Staff,
Priority: $scope.FilterData.Priority == undefined ? null : $scope.FilterData.Priority,
Manager: $scope.FilterData.Manager == undefined ? null : $scope.FilterData.Manager,
Status: $scope.FilterData.Status == undefined ? null : $scope.FilterData.Status
}
$scope.tableParams.filter($scope.filters);
};
$scope.search = '';
function loadAllJobRecords() {
$("#divLoading").show();
var promiseGetAllJobs = jobService.GetAllJobs();
promiseGetAllJobs.then(function (pl) {
$("#divLoading").hide();
$scope.Jobs = pl.data;
$scope.JobTitle = "All Engagements";
$scope.Action = $sce.trustAsResourceUrl("/Job/ExportAllJobRecords");
// $scope.Action = "/Job/ExportAllJobRecords";
$scope.tableParams = new NgTableParams({
page: 1, // show first page
count: 10, // count per page
sorting: {
JobNum: 'asc' // initial sorting
},
filter: $scope.search
},
{ dataset: pl.data },
{
total: pl.data.length,
getData: function ($defer, params) {
var filteredData = params.filter() ? $filter('filter')(pl.data, params.filter()) : pl.data;
var orderedData = params.sorting() ? $filter('orderBy')(filteredData, params.orderBy()) : filteredData; params.total(filteredData.length);
$defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
}
});
},
function (errorPl) {
$scope.error = errorPl;
});
}
});
Html如下所示
<div class="x_panel">
<div class="x_title">
<h2>{{JobTitle}}<small></small></h2>
<div class="clearfix"></div>
</div>
<div class="x_content col-md-12">
<div class="row col-md-12 data-tablex">
<div class="col-md-offset-8 col-md-4 col-sm-12 col-xs-12 data-tablex data-tabley">
<input type="text" class="form-control" placeholder="Search" ng-model="search" />
</div>
<div class="col-md-offset-8 col-md-4 col-sm-12 col-xs-12 data-tablex data-tableym">
<form action="{{Action}}" method="post" class="frm-export" id="frmexport">
@{Html.RenderAction("Filter", "Job");}
<input type="submit" value="Export" class="btn-export" id="btnexport" />
<a href="" class="toggle-filter"><i class="fa fa-list"></i> Filter</a>
<a href="javascript:document.getElementById('btnexport').click();"><i class="fa fa-list"></i> Export</a>
@* <button type="submit" class="btn btn-success" ng-click="Export(Jobs)">Export</button>*@
</form>
</div>
<div class="col-md-offset-8 col-md-4 col-sm-12 col-xs-12 data-tablex data-tableyr">
<p class="text-right">
<strong>page: {{tableParams.page()}} of {{tableParams.total()/tableParams.count()}}</strong>
</p>
</div>
<div class="form-group form-filter">
<div class="col-md-12 col-sm-12 col-xs-12 col-md-offset-0 row table-filter">
<form action="{{Action}}" method="post" class="frm-exportx">
@{Html.RenderAction("Filter", "Job");}
</form>
</div>
</div>
<div class="col-md-12 col-sm-12 colxs12 data-tablex" style="">
<table id="tblAllJobs" class="ng-table-responsive table table-striped table-bordered table-jobs" ng-table="tableParams" template-pagination="custom/pager">
<tr ng-repeat="Job in $data | filter:search">
<td data-title="'Job'" sortable="'JobNum'">
<a href="/#/EditJob" ng-click="editJob(Job.JobNum)">{{ Job.JobNum }}</a>
</td>
<td data-title="'Priority'" sortable="'Priority'">
{{ Job.Priority }}
</td>
<td data-title="'Staff'" sortable="'Staff'">
{{ Job.Staff }}
</td>
<td data-title="'Title'" sortable="'JobName'">
{{ Job.JobName }}
</td>
<td data-title="'Company'" sortable="'Company'">
{{ Job.Company}}
</td>
<td data-title="'Deadlines'" sortable="'Deadlines'">
{{ Job.Deadlines}}
</td>
<td data-title="'Status'" sortable="'StatusComment'">
{{ Job.StatusComment}}
</td>
<td data-title="'Copy'" class="td-center"><a href="/#/CreateAsNewJob" ng-click="CreateAsNewJob(Job.JobNum)"><i class="fa fa-plus"></i></a></td>
@* <td data-title="'Edit'"><a ng-click="editJob(Job.JobNum)"><i class="fa fa-pencil"></i></a></td>*@
</tr>
@* <tr class="noRecordMsg" ng-hide="$data.length"><td colspan="7" align="center">No Jobs available</td></tr>*@
<tr class="noRecordMsg" ng-hide="$data.length"><td colspan="8" align="center">No Jobs available</td></tr>
</table>
</div>
</div>
</div>
</div>
<script type="text/ng-template" id="custom/pager">
<ul class="pager ng-cloak">
<li ng-repeat="page in pages"
ng-class="{'disabled': !page.active, 'previous': page.type == 'prev', 'next': page.type == 'next'}"
ng-show="page.type == 'prev' || page.type == 'next'" ng-switch="page.type">
<a ng-switch-when="prev" ng-click="params.page(page.number)" href="">« Previous</a>
<a ng-switch-when="next" ng-click="params.page(page.number)" href="">Next »</a>
</li>
<li>
<div class="btn-group">
<button type="button" ng-class="{'active':params.count() == 5}" ng-click="params.count(5)" class="btn btn-default">5</button>
<button type="button" ng-class="{'active':params.count() == 10}" ng-click="params.count(10)" class="btn btn-default">10</button>
<button type="button" ng-class="{'active':params.count() == 20}" ng-click="params.count(20)" class="btn btn-default">20</button>
<button type="button" ng-class="{'active':params.count() == 50}" ng-click="params.count(50)" class="btn btn-default">50</button>
</div>
</li>
</ul>
</script>
{{JobTitle}}
@{Html.RenderAction(“过滤器”、“作业”);}
@*出口*@
页面:{{tableParams.total()/tableParams.count()}}中的{{tableParams.page()}
@{Html.RenderAction(“过滤器”、“作业”);}
{{Job.Priority}
{{Job.Staff}
{{Job.JobName}
{{Job.Company}
{{作业.截止日期}
{{Job.StatusComment}
@*
5.
10
20
50
我已搜索过滤器问题,但找不到解决方案