Ich habe eine funktionierende Knockout-Vorlage für eine Paginierungs-Benutzeroberfläche, die mit einem Knockout-basierten gemeinsamen Datenraster funktioniert. Diese Vorlage rendert eine HREF für jede "Seite" von Daten im Raster.

Die Vorlage funktioniert, ist aber klobig, denn wenn ich viele Daten abrufe, landen Dutzende von Navigationsseitenlinks unter dem Raster. Hier ist die aktuelle Vorlage:

<div class="idTemplate_ko_simpleGrid_pageLinks">
    <p>
        <span>Go to page:</span>
        <!-- ko foreach: ko.utils.range(0, maxPageIndex) -->
            <a href="javascript:void(0);"
               class="grid-pagination" 
               data-bind="text: $data + 1, click: function() { $root.currentPageIndex($data) }, css: { selected: $data == $root.currentPageIndex() }"></a>
        <!-- /ko -->
    </p>
</div>

Der Wert 'currentPageIndex' ist nur ein einfaches ko, das im Modell beobachtet werden kann:

this.currentPageIndex = ko.observable(0);

Und 'maxPageIndex' ist eine berechnete beobachtbare Größe im Modell:

this.maxPageIndex = ko.computed(function () {
    return Math.ceil(ko.utils.unwrapObservable(this.filteredItems()).length / this.pageSize()) - 1;
}, this);

Wie kann ich die Vorlage und das Modell ändern, um eine Paging-Benutzeroberfläche zu aktivieren, die StackOverflow ähnelt?

Zum Beispiel:

zurück 1 ... 3 4 5 6 7 ... 69 weiter