Ng-table: Paginierung funktioniert nicht mit benutzerdefinierten Daten aus der JSON-Datei

Erstellt am 2. Aug. 2016  ·  10Kommentare  ·  Quelle: esvit/ng-table

Ich verwende benutzerdefinierte Daten aus der JSON-Datei und möchte die Daten paginieren, aber alle Daten kommen auf einer einzigen Seite. warum so? Unten sind mein Code

 $http.get('app/user_keys.json').success(function(data) {
            vm.data = data;
            vm.tableParams = new NgTableParams({ page: 1, count: 2 }, {
                    total: vm.data.length,
                    getData: function (params) {
                        console.log(vm.data.length);
                        var deferred = $q.defer();
                        var orderedData = params.sorting() ? $filter('orderBy')(vm.data, params.orderBy()) : vm.data;
                        deferred.resolve(orderedData.slice((params.page() - 1) * params.count(),  params.page() * params.count()));
                    }
                });
        });
<table ng-table="vm.tableParams" class="table table-striped" >
                    <colgroup>
                          <col width="5%"/>
                          <col width="30%"/>
                          <col width="50%"/>
                          <col width="15%"/>
                    </colgroup>
                    <tr ng-repeat="row in vm.data | filter: searchText  track by $index">
                        <td header="'headerCheckbox.html'">
                        <input type="checkbox" value="row._id" ng-model="vm.checkboxes.items[row._id]" ></td>
                        <td data-title="'ID'">{{ row.index }}</td>
                        <td data-title="'Cloud Location'">{{ row.location }}</td>
                        <td data-title="'Action'"><i class="fa fa-trash"></i></td>
                    </tr>
                </table>

Hilfreichster Kommentar

Ok, ich habe es behoben, weil dataOptions möglicherweise undefined ist. So sollte der Code sein

 if (settings.dataOptions && !settings.dataOptions.applyPaging) {
   return ngTableDefaultGetData(result, params);
 }

Alle 10 Kommentare

Sind Sie sicher, dass es damit zusammenhängt, dass Ihre Quelle eine JSON-Datei ist?
Ich habe das gleiche Problem, denke ich, obwohl meine Datenquelle ein Dienst ist.

Dieser Dienst gibt ein Versprechen zurück, und wenn es aufgelöst wird, setze ich params.total() , wie in der Dokumentation beschrieben, bevor ich das Ergebnis zurückgebe, aber die Paginierung funktioniert immer noch nicht.

Ich habe das gleiche Problem, wenn ich nach Gruppendaten blättere. Also füge ich diese Zeilen am Ende der getGroups- Funktion hinzu.

if (!settings.dataOptions.applyPaging) {
    return ngTableDefaultGetData(result, params);
}
return ngTableDefaultGetData.applyPaging(result, params);

Die Paginierung arbeitet entweder mit dem verwendeten Standard oder mit dem Benutzerdefiniert.

Ja, das ist fast die gleiche Lösung, die ich in #872 erwähnt habe. Ich bin mir nicht sicher, ob der settings.dataOptions.applyPaging -Check wichtig ist, da er einige Zeilen oben manuell auf falsch gesetzt wird.

@fsm3xpert , @tandibar , ich habe die von @fsm3xpert vorgeschlagene Lösung angewendet und sie funktioniert, aber ich bekomme Folgendes in meiner Konsole:

Possibly unhandled rejection: {}

Irgendwelche Ideen?

Ok, ich habe es behoben, weil dataOptions möglicherweise undefined ist. So sollte der Code sein

 if (settings.dataOptions && !settings.dataOptions.applyPaging) {
   return ngTableDefaultGetData(result, params);
 }

Übrigens wird eine zukünftige Version von ng-table bedeuten, dass verschachtelte Einstellungswerte (EG
dataOptions) wird niemals undefiniert sein

Am Mittwoch, 21. Dezember 2016 um 19:19 Uhr, María Inés Parnisari <
[email protected]> schrieb:

Ok, ich habe es behoben, weil dataOptions möglicherweise nicht definiert ist. Also der Code
sollte sein

if (settings.dataOptions && !settings.dataOptions.applyPaging) {
gib ngTableDefaultGetData (Ergebnis, Parameter) zurück;
}


Sie erhalten dies, weil Sie diesen Thread abonniert haben.
Antworten Sie direkt auf diese E-Mail und zeigen Sie sie auf GitHub an
https://github.com/esvit/ng-table/issues/893#issuecomment-268614815 , oder stumm
der Faden
https://github.com/notifications/unsubscribe-auth/AA2HPk4I47xMpIlEbXSDSCMUu0mlGn7Vks5rKXu4gaJpZM4Jagxg
.

Falls jemand das gleiche Problem hat wie ich, nämlich dass das Ändern des Bibliothekscodes aus irgendeinem Grund keine Option ist, habe ich eine Problemumgehung gefunden:

Das Problem scheint zu sein, dass die Gruppierung einfach nicht implementiert ist, um mit ausgelagerten Daten umzugehen. Am Ende habe ich meine Daten für die gewünschte Seite abgerufen und die Gesamtzahl der Elemente in einer Variablen zwischengespeichert.
actualTotal = params.total()
Ich habe dann einen Response Interceptor implementiert, wie in http://ng-table.com/#/global -customization/demo-response-interceptors beschrieben. Dort kann ich den Gesamtwert auf den zwischengespeicherten Wert zurücksetzen. Dies korrigiert die Anzeige des Paging.

Es gibt ein verbleibendes Problem: Wenn der Benutzer versucht, zu einer anderen Seite als 1 zu wechseln, sehen Sie nichts, da die Gruppierung das Datenarray mit diesem Code aufteilt:
var pagedData = data.slice((params.page() - 1) * params.count(), params.page() * params.count());
Eine einfache Problemumgehung besteht auch darin, die Seite in der getData-Funktion auf 1 zu setzen, sobald Sie die Daten abgerufen haben, die eigentliche Seite zwischenzuspeichern und im Interceptor zurückzusetzen.

Nach dem Anwenden des vorgeschlagenen Fixes funktionierte die Filterung bei mir nicht mehr. Um es zu beheben, musste ich in den Zeilen oben dataOptions wie folgt setzen:

settings.dataOptions = { applyPaging: false, applyFilter: false };

ist dieser Fix in der neuesten Version verfügbar? wenn nicht, in welcher Zeile muss es hinzugefügt werden.

Es ist in der letzten Version nicht verfügbar.
Ich habe es zum Laufen gebracht, indem ich diesen Codeabschnitt geändert habe:
if (sortDirection) {
var orderByFn = ngTableDefaultGetData.getOrderByFn();
var orderBy = util_1.convertSortToOrderBy({
value: sortDirection
});
result = orderByFn(result, orderBy);
}
return ngTableDefaultGetData.applyPaging(result, params);

mit diesem:
if (sortDirection) {
var orderByFn = ngTableDefaultGetData.getOrderByFn();
var orderBy = util_1.convertSortToOrderBy({
value: sortDirection
});
result = orderByFn(result, orderBy);
}
if (sortDirection) { var orderByFn = ngTableDefaultGetData.getOrderByFn(); var orderBy = util_1.convertSortToOrderBy({ value: sortDirection }); result = orderByFn(result, orderBy); } if (!settings.dataOptions.applyPaging) { return ngTableDefaultGetData(result, params); } return ngTableDefaultGetData.applyPaging(result, params);`

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen

Verwandte Themen

yujiayinshi picture yujiayinshi  ·  8Kommentare

ulise picture ulise  ·  5Kommentare

zeeshanhanif picture zeeshanhanif  ·  5Kommentare

ghost picture ghost  ·  30Kommentare

jlebleu picture jlebleu  ·  3Kommentare