Ich habe eine funktionierende Knockout-Vorlage für einige Paginierungs-UI, die mit einem Knockout-basierten gemeinsamen Datenraster arbeitet. Diese Vorlage rendert einen HREF für jede "Seite" von Daten im Raster.
Die Vorlage funktioniert, aber sie ist klunkig, denn wenn ich eine Menge Daten abrufe, lande ich unter dem Raster mit Dutzenden von Navigationsseitenlinks. Hier ist die aktuelle Vorlage:
%Vor%Der Wert für 'currentPageIndex' ist im Modell nur ein einfacher Ko-Wert:
%Vor%Und 'maxPageIndex' ist eine berechnete Observable im Modell:
%Vor%Wie kann ich die Vorlage und das Modell so ändern, dass die UI-Benutzeroberfläche ähnlich wie StackOverflow funktioniert?
Zum Beispiel:
prev 1 ... 3 4 5 6 7 ... 69 nächstes
Dies ist genau der Pager-Stil, den ich seit einiger Zeit benutze.
Ich habe gerade die Pager-Funktionalität, die ich in verschiedenen Projekten verwendet habe, in eine Erweiterung von knockout und template extrahiert.
Siehe Ссылка für die Quelle und Ссылка für ein funktionierendes Beispiel.
Alle Berechnungen und einige praktische Eigenschaften werden von der Pager-Klasse zur Verfügung gestellt, die Sie erstellen und an die Sie sich binden können. Aber eine Beispielarbeitsvorlage ist enthalten.
Siehe die Quelle example.html zur Verwendung.
Als erstes würde ich nachsehen, ob es irgendwelche benutzerdefinierten Bindungen oder Bibliotheken gibt, die das tun. Wenn dies der Fall ist, erstellen Sie eine benutzerdefinierte Bindung, die diese Bibliothek verwendet.
Sicherungsplan - machen Sie Ihre eigene benutzerdefinierte Bindung. Ich würde etwas wie:
machen %Vor%Führen Sie dann in meiner benutzerdefinierten Bindung Folgendes aus:
%Vor%Tags und Links knockout.js mvvm templates paging