Ng-table: ページ付けは、jsonファイルのカスタムデータでは機能しません

作成日 2016年08月02日  ·  10コメント  ·  ソース: esvit/ng-table

.jsonファイルのカスタムデータを使用していて、データをページ分割したいのですが、すべてのデータが1ページに表示されます。 なぜそうなのか？ 以下は私のコードです

 $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>
picture zymr-keshav
👍3

最も参考になるコメント

修正しましたdataOptionsがundefinedである可能性があるためです。 したがって、コードは次のようになります

 if (settings.dataOptions && !settings.dataOptions.applyPaging) {
   return ngTableDefaultGetData(result, params);
 }
picture miparnisari 2016年12月21日
👍4

全てのコメント10件

ソースがJSONファイルであるという事実に関連していると思いますか？
私のデータソースはサービスですが、同じ問題が発生していると思います。

そのサービスはpromiseを返し、それが解決されたら、結果を返す前にドキュメントで説明されているようにparams.total()を設定しましたが、ページネーションは機能しません。

batjko picture batjko 2016年08月11日

グループデータをページングするときにも同じ問題が発生します。 したがって、 getGroups関数の最後にこれらの行を追加します。

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

使用されたデフォルトまたはカスタムのいずれかで動作するページネーション。

fsm3xpert picture fsm3xpert 2016年08月11日
👍1

はい、これは私が＃872で述べたのとほぼ同じ解決策です。 settings.dataOptions.applyPagingチェックが重要かどうかはわかりません。これは、上記のいくつかの行を手動でfalseに設定しているためです。

tandibar picture tandibar 2016年08月12日

@ fsm3xpert 、@ tandibar 、 @ fsm3xpertによって提案されたソリューションを適用しましたが、動作しますが、コンソールに次のように表示されます。

Possibly unhandled rejection: {}

何か案は？

miparnisari picture miparnisari 2016年12月19日

修正しましたdataOptionsがundefinedである可能性があるためです。 したがって、コードは次のようになります

 if (settings.dataOptions && !settings.dataOptions.applyPaging) {
   return ngTableDefaultGetData(result, params);
 }
miparnisari picture miparnisari 2016年12月21日
👍4

ところで、ng-tableの将来のリリースは、ネストされた設定値（EG
dataOptions）が未定義になることはありません

2016年12月21日水曜日午後7時19分、マリア・イネス・パルニサリ<
[email protected]>は次のように書いています：

修正しました。dataOptionsが定義されていない可能性があるためです。 したがって、コード
する必要があります

if（settings.dataOptions &&！settings.dataOptions.applyPaging）{
ngTableDefaultGetData（result、params）;を返します。
}

—
このスレッドにサブスクライブしているため、これを受け取っています。
このメールに直接返信し、GitHubで表示してください
https://github.com/esvit/ng-table/issues/893#issuecomment-268614815 、またはミュート
スレッド
https://github.com/notifications/unsubscribe-auth/AA2HPk4I47xMpIlEbXSDSCMUu0mlGn7Vks5rKXu4gaJpZM4Jagxg
。

christianacca picture christianacca 2016年12月22日

誰かが私と同じ問題を抱えている場合、つまり、ライブラリコードを変更することは何らかの理由でオプションではないということですが、回避策を見つけました。

問題は、ページングされたデータを処理するためにグループ化が単に実装されていないことであるように思われます。 最終的には、目的のページのデータを取得し、アイテムの総数を変数にキャッシュすることになりました。
actualTotal = params.total()
次に、 http： //ng-table.com/#/global-customization/demo-response-interceptorsで説明されているように応答インターセプターを実装しました。 そこで、合計値をキャッシュされた値に戻すことができます。 これにより、ページングの表示が修正されます。

残っている問題が1つあります。それは、ユーザーが1以外の別のページに移動しようとすると、グループ化によってデータ配列が次のコードでスライスされるため、何も表示されないことです。
var pagedData = data.slice((params.page() - 1) * params.count(), params.page() * params.count());
このための簡単な回避策は、データを取得したらgetData関数でページを1に設定し、実際のページをキャッシュしてインターセプターでリセットすることです。

enpo picture enpo 2017年01月03日

提案された修正を適用した後、フィルタリングが機能しなくなりました。 これを修正するには、上記の行で、 dataOptionsを次のように設定する必要がありました。

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

nmoinvaz picture nmoinvaz 2017年10月07日

この修正は最新バージョンで利用できますか？ どの行に追加する必要がない場合。

r-arun-r picture r-arun-r 2018年03月06日

以前のバージョンでは使用できません。
コードのこのセクションを変更して動作させました：
if (sortDirection) {
var orderByFn = ngTableDefaultGetData.getOrderByFn();
var orderBy = util_1.convertSortToOrderBy({
value: sortDirection
});
result = orderByFn(result, orderBy);
}
return ngTableDefaultGetData.applyPaging(result, params);

これとともに：
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）; `

davidecampello picture davidecampello 2019年01月08日
このページは役に立ちましたか？
0 / 5 - 0 評価

関連する問題

muhlegg picture muhlegg  ·  29コメント
wayjake picture wayjake  ·  6コメント
Ebolon picture Ebolon  ·  12コメント
yujiayinshi picture yujiayinshi  ·  4コメント
ulise picture ulise  ·  5コメント