pageIndexプロパティを維持するページング関数を備えたビューモデルがあります。ビューモデルには、ページを含むページ配列があります。各ページには独自のpageNumberプロパティがあります。
ビューモデルのページングコード:
//paging
pageIndex: ko.observable(),
pageSize: ko.observable(),
pageCount: ko.observable(),
pages: ko.observableArray([]),
nextPage: function () {
alert("Next");
this.pageIndex = this.pageIndex + 1;
alert(this.pageIndex);
},
previousPage: function () {
//alert("PRev");
this.pageIndex = this.pageIndex - 1;
alert(this.pageIndex);
},
gotoPage: function (page) {
//alert("GO:" + page.pageNumber);
this.pageIndex = page.pageNumber;
alert(this.pageIndex);
},
私の見解では、ネストされたリストは次のようになっています。
<nav id="paging">
<ul class="paginationList">
<li class="paginationList" data-bind="visible: pageIndex > 0">
<a href="#" data-bind="click: previousPage"><<</a>
</li>
</ul>
<ul class="paginationList" data-bind="foreach: pages">
<li class="paginationList">
<a href="#" data-bind="click: $parent.gotoPage, css: { disabled: $parent.pageIndex == $data.pageNumber }, text: $data.pageNumber"></a>
</li>
</ul>
<ul class="paginationList">
<li class="paginationList" data-bind="visible: pageIndex < pageCount">
<a href="#" data-bind="click: nextPage">>></a>
</li>
</ul>
動作しますが、[次へ]関数をクリックするとpageIndexは変更されますが、アンカーが無効になっている状態は変更されません。
なぜそれが起こるのか解決できません。