0

添付されたコードを正しく動作させるために、私はほとんど 1 日のほとんどを完全にフラストレーションを感じながら遊んでいました。コードは多かれ少なかれhttp://jsfiddle.net/rniemeyer/5Xr2X/から取得されます。私のバージョンでは、最初のページ、IE、最初の 10 行が表示されます。[次へ] をクリックすると pagedRows 関数が起動されますが、データの次のページが表示されることはありません。ひえええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええええ

添付はコードです

<table>
   <tr>
       <th>Id</th>
       <th>Type</th>
       <th>Name</th>
    </tr>
  <tbody data-bind='template: { name: "fieldTemplate", foreach: pagedRows }'></tbody>
</table>

<a href="#" data-bind="click: previous, visible: pageIndex() > 0">Previous</a>
<a href="#" data-bind="click: next, visible: pageIndex() < maxPageIndex()">Next</a>

<script type="text/html" id="fieldTemplate">
    <tr>
         <td><span data-bind="text:FieldId" /></td>
         <td><span data-bind="text:Type" /></td>
         <td><span data-bind="text:Description" /></td>
    </tr>
</script>

<script>
    function ViewModel(jsondata) {
        var self = this;
        self.fields = ko.observableArray(jsondata);
        self.pageIndex = ko.observable(0);
        self.pageSize = ko.observable(10);

        self.pagedRows = ko.computed(function () {
            var size = self.pageSize();
            var start = self.pageIndex() * size;
            return self.fields.slice(start, start + size);
        });

        self.maxPageIndex = ko.computed(function () {
            return Math.ceil(self.fields().length / self.pageSize()) - 1;
        });

        self.next = function () {
            self.pageIndex(self.pageIndex + 1);
        }
        self.previous = function () {
            self.pageIndex(self.pageIndex - 1);
        }
    }

    $(function () {
        var data = [];
        for (var i = 0; i < 100; i++) {
            data.push({
                FieldId: i,
                Type: "Type" + i,
                Name: "Name" + i,
                Description: "Description" + i
            })
        }

        ko.applyBindings(new ViewModel(data));

    });
</script>

めちゃくちゃ簡単に思えますが、私はそれを理解していません。どんな助けでも大歓迎です。

ありがとう

マイク

4

1 に答える 1

2

次/前のアクションを実行しているときは、オブザーバブルの値を関数として呼び出して取得し、それに 1 を加算または減算する必要があります。したがって、次のようにします。

self.next = function() {
    self.pageIndex(self.pageIndex() + 1);
}
self.previous = function() {
    self.pageIndex(self.pageIndex() - 1);
}
于 2012-11-15T01:07:07.950 に答える