私はページ区切りが新しく、私が読んだものからAngular JSのために非常に求められているという指示が見つかりました。私は私が作成した自分のページ区切りhtml/CSSレイアウトで動作するページネーションを実装しようとしています。Angular JS:Pagination.tpl.htmlテンプレートを使用せずにページ区切りディレクティブJSを使用するページ分割
ページ番号は正しく表示され、表示されている項目の数が指定したとおりに正しく表示されます。しかし、ページネーションリストのページ2をクリックすると問題が発生し、次の5つの項目がロードされません。それは単に同じリストにとどまります。
このディレクティブのすべての部分を正しく使用する方法が混乱していますので、このディレクティブを実装する際に間違っていると思います。
私が従うガイドは上記のリポジトリと同じhereです。
dirPagination.js
次のように私のHTMLは次のとおりです:私のコントローラで
<div id="pages" ng-if="1 < pages.length || !autoHide">
<span ng-class="{ active : pagination.current == pageNumber,
disabled : pageNumber == '...' }" class="pagenumber"
dir-paginate="pageID in controller.list| filter:q | itemsPerPage:
controller.pageCount" current-page="controller.currentPage">
<a href="" ng-click="setCurrent(pageID)">{{ pageID.id }}</a>
</span>
</div>
<div class="myResults" dir-paginate="results
in controller.list| filter:q | itemsPerPage: 5" current-page="1">
<div class="listFigures">
<figure class="imageList">
<img ng-src="{{results.image}}" ng-alt=
{{results.imageAlt}}" ng-title=
{{results.imageTitle}}" />
</figure>
</div>
</div>
私はそれが使用されているどのように多くの項目(に基づいてPAGECOUNTセットを持つファイルをダウンロードし、プロジェクトに追加
パラメータとして、現在何ページを表示するか)
vm.pageCount=2;
vm.currentPage = 1;
ワーキング:
- ページのリストは、あなたがそれが8ページであることがわかります上記のコード以下、表示されます。
- のみ5項目
が機能していない示されているように表示されます(この場合は2で)別のページに
- クリックすると、データの別のページに私をもたらすことはありません。リストはリフレッシュされません。別のページ番号をクリックすると、5つの項目の同じリストが表示されます。
- :5は、第二のページ番号をクリックして表示されているとの8つの項目の合計は、研究の最後の3
記事を表示する必要がありますあります
私の実装が完全にオフになっている場合、これをどうやって取得するのか非常に混乱しています。私はいくつかの記事を読んだだけでなく、リポジトリのガイドに従ってみることを試みましたが、正しく使用する方法を理解していません。どんな助けでも大歓迎です。あなたは、これらのそれぞれをどのように使用するかを示す良い例を付けることができるならば、への新規開発者にはhtml/css
というカスタムを実装し、dirPagination.tpl.html template
を使用しないでください。
ベストプラクティスに従うと、標準角度のhereを読むことができます。