ng-table
ng-table copied to clipboard
hasEmptyOption() check in Select Filter doesn't work when filter data loaded async
ngTableSelectFilterDs.directive.ts has a function called hasEmptyOption() that checks whether the filter option array contains a member with id === '', so it will not add another empty option if there is already one in the filter option array. However, this is not working when the filter data is loaded async.
Here's my HTML code to create the table:
<table show-filter="true" ng-table="tableParams" class="table table-striped table-hover">
<tbody>
<tr ng-repeat="i in $data">
<td" title="'Order ID'" filter="{ orderID : 'text' }"> {{i.orderID}}</td>
<td title="'Panel'" filter="panelFilter()" filter-data="getPanelsForTable()">{{i.panel}}</td>
</tr>
</tbody>
</table>
And here's the Javascript function I'm using to load the filter options from the server asynchronously:
function getPanelsForTable(data) {
var def = $q.defer();
DataLoaderService.getPanelTypes().then(function(res) {
$scope.panelTypes = _.map(res.data, function(p) {
return {
'id': p,
'title': p
};
});
$scope.panelTypes.unshift({'id': '', 'title': '--Select Panel'});
def.resolve($scope.panelTypes);
});
return def;
};
The select filter adds an empty option in addition to the one I added, resulting in both a blank empty option and my "--Select Panel" empty option. However, I don't have this problem when I pass in an array object as filter-data with an empty option or if I pass in a function that returns an array with an empty option. This is only broken when it's a promise that passes an array object async.
I have same problem. Has there been a solution or a work around?