Select filter in ngTable does not update when ngta

问题:

I have a situation where I need to show all data on checkbox click, which reloads the ngtable, but the select filter does not load and shows previous value. Is there any other way to reload ngtable filters? Here is my plunker for the problem.

Code

<input id="datalabels" ng-model="taskCheckbox.isNormal" ng-change="allTaskCheckboxClicked(taskCheckbox.isNormal)" type="checkbox">
<label for="datalabels" style="font-weight:bold;">Show All Tasks</label>
<table ng-table="taskDetailTableParams" show-filter="true" class="table upgradeTaskDetailTable text-left table-bordered">
    <tbody>
        <tr ng-repeat="item in $data" height="10px" class="animate" ng-animate="{enter: 'animate-enter', leave: 'animate-leave'}">
            <td data-title="" class="text-center col-sm-1 col-md-1 col-lg-1" header-class="text-left" filter="{ 'ctaskId': 'select' }" sortable="'ctaskId'" filter-data="filterCTasks($column)">
                <img ng-src="{{ item.taskImage }}" title="{{ item.task }}" data-toggle="tooltip" data-placement="bottom" />
            </td>
            <td data-title="'Task Name'" class="text-left col-sm-3 col-md-3 col-lg-3" header-class="text-left" filter="{ 'name': 'text' }" sortable="'name'">{{ item.name }}</td>
            <td data-title="'Type of Task'" class="text-center col-sm-2 col-md-2 col-lg-2" header-class="text-left" filter="{ 'type': 'text' }" sortable="'type'">{{item.type}}</td>
            <td data-title="'latest Run'" class="text-center col-sm-2 col-md-2 col-lg-2" header-class="text-left" filter="{ 'selectIdFor0': 'select' }" sortable="'selectIdFor0'" filter-data="filterStatusFor0($column)">
                <img ng-src="{{ item.statusImageFor0 }}" title="{{ item.statusFor0 }}" data-toggle="tooltip" data-placement="bottom" />
            </td>
            <td data-title="'2nd Latest Run'" class="text-center col-sm-2 col-md-2 col-lg-2" header-class="text-left" filter="{ 'selectIdFor1': 'select' }" sortable="'selectIdFor1'" filter-data="filterStatusFor1($column)">
                <img ng-src="{{ item.statusImageFor1 }}" title="{{ item.statusFor1 }}" data-toggle="tooltip" data-placement="bottom" />
            </td>
            <td data-title="'3rd Latest Run'" class="text-center col-sm-2 col-md-2 col-lg-2" header-class="text-left" filter="{ 'selectIdFor2': 'select' }" sortable="'selectIdFor2'" filter-data="filterStatusFor2($column)">
                <img ng-src="{{ item.statusImageFor2 }}" title="{{ item.statusFor2 }}" data-toggle="tooltip" data-placement="bottom" />
            </td>
        </tr>
    </tbody>
</table>

$scope.filterCTasks = function(column) {
    console.log(JSON.stringify(column));
    var def = $q.defer(),
        arr = [],
        filterStatus = [];
    angular.forEach($scope.taskDetailData, function(item) {
        if (jQuery.inArray(item.ctaskId, arr) === -1) {
            arr.push(item.ctaskId);
            filterStatus.push({
                'id': item.ctaskId,
                'title': item.task
            });
        }
    });
    filterStatus.sort(function(a, b) {
        if (a.id < b.id)
            return -1;
        if (a.id > b.id)
            return 1;
        return 0;
    });
    def.resolve(filterStatus);
    return def;
}