Wie in ngTable

Question

filtern Mit Angular, mache ich HTTP-Anfrage, um Daten zu nehmen. Ich habe ngTable hinzugefügt und verwendet, um Daten anzuzeigen. Sie werden in der Tabelle korrekt angezeigt, aber ich kann sie nicht filtern, sortieren und löschen. Warum?

js:

 $scope.cancel = cancel; 

function cancel(row, rowForm) { 
    var originalRow = resetRow(row, rowForm); 
    angular.extend(row, originalRow); 
} 

$scope.tableParams.reload().then(function(data) { 
    if (data.length === 0 && $scope.tableParams.total() > 0) { 
    $scope.tableParams.page($scope.tableParams.page() - 1); 
    $scope.tableParams.reload(); 
    } 
}); 

    $http.get('my_url') 
.success(function(data, status) { 
    $scope.data = data; 

    $scope.tableParams = new ngTableParams({ 
    page: 1,   // show first page 
    count: 10   // count per page 
    }, { 
    total: $scope.data.length, // length of data 
    getData: function($defer, params) { 
     // use build-in angular filter 
     var orderedData = params.sorting() ? 
     $filter('orderBy')($scope.data, params.orderBy()) : 
     $scope.data; 

     $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
    } 
    }); 
}); 

html:

<table ng-table="tableParams" show-filter="true" class="table table-bordered table-striped"> 
    <tr ng-repeat="row in data track by row.id"> 
    <td title="'Id'" filter="{id: 'text'}" sortable="'id'">{{row.id}}</td> 
    <td title="'Company'" filter="{company: 'text'}" sortable="'company'">{{row.company}}</td> 
    <td title="'Email'" filter="{email: 'text'}" sortable="'email'">{{row.email}}</td> 
    <td title="'Note'" filter="{note: 'text'}" sortable="'note'">{{row.note}}</td> 
    <td> 
     <button class="btn btn-default btn-sm" ng-click="cancel(row, rowForm)"><span class="glyphicon glyphicon-remove"></span></button> 
    </td> 
    </tr> 
</table> 

Answer 1

Sie sind keine Filter innerhalb getData Methode anwenden.

Zuerst müssen Sie die Daten filtern, dann sind Sie sort:

getData: function($defer, params) { 
    // I will use a copy of the data to always start with the original data 
    // array ($scope.data). If you are getting the data with $resource or $http 
    // you can replace the $scope.data with the data obtained (eg.: response.data) 
    var theData = angular.copy($scope.data); 

    // First we filter using the filter object provided by the 
    // method 'filter()' of ngTableParams instance. 
    var filterObj = params.filter(), 
     filteredData = $filter('filter')($scope.data, filterObj); 

    // Then we sort the FILTERED DATA ARRAY 
    // NOTICE that the first parameter provided to $filter('orderBy') 
    // is the filtered array <filteredData> and not the original 
    // data array. 
    var sortObj = params.sorting(), 
     orderedData = $filter('orderBy')(filteredData, filterObj); 

    // Then we return the final data array (orderedData) 
    $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
}