2016-05-18 6 views
0

Ich habe eine kleine Web-App, die input von einem Menschen akzeptiert, um Suchparameter zu erstellen. Ich verwende ng-model-options, um die ng-change Funktion zu debugnen, um die Suche auszuführen.DRY up ng-Modell

Ich habe kleine Pfeile neben den Spaltennamen auf dem Tisch, die Benutzer sortieren können (es gibt drei Symbole - up-down, up und down für die sort_field und sort_order angezeigt mit ng-class); Ich möchte eine Änderung an diesen registrieren und eine Suche nach einer kleinen Verzögerung mit Debounce ausführen. Das Problem ist, ich bin mir nicht sicher, wie ng-model verwenden, um den bestimmten Parameter an diese Symbole zu binden. Ich möchte nicht, dass jemand auf die Sortiersymbole hämmert und den Server oder den Browser abstürzt.

Was ich lieber tun würde, ist ein Platz auf der Seite, die besagt, das search_param Objekt zu beobachten und eine Suche 500 Millisekunden nach jeder Änderung auslösen. Auf diese Weise würden alle Eingabefelder oder Sortierungsauswahlen aufgerufen werden, wenn ein Benutzer mit der Bearbeitung fertig ist, was eine Funktion zum Senden dieser Parameter an den Endpunkt auslöst.

Was ist die Strategie in AngularJS, dies zu tun? Im Moment binden alle Eingabefelder ein Feld im search_param Objekt und haben ng-model-options, um bei Änderung zu debuggen. Das ist viel wiederholter Code.

+0

Sie die gleiche Funktion für 'ng-change' überall verwenden Sie? In diesem Fall können Sie '$ timeout' verwenden, und wenn in der Warteschlange keine Suche stattfindet, können Sie eine mit' $ timeout' starten. Wenn dies der Fall ist, brechen Sie einfach das $ Timeout ab und starten Sie ein neues. –

Antwort

0

Ich habe vor kurzem jemanden über Tabellen und die Menge an Aufwand und Arbeit, die Sie eingeben müssen, um sehr grundlegende Funktionalität (Sortieren, Suchen, Paginierung) zu erhalten.

Warum das Rad neu erfinden, wenn es eine ganz große Bibliothek ist für Sie zu nutzen: Angular-Datentabellen

ich hier eine komplette Lösung gepostet für Sie Daten aus einer json Quelle zu verwenden, ziehen: Ng-repeat trying to create a counter index

In Ihrem Fall müssen Sie durch die Server-seitige Verarbeitung Dokumentation auf Datatable-Standort gehen die Daten richtig zu formatieren: https://datatables.net/manual/server-side