update - angularjs set html title




Wie kann man angular-ui typeahead mit einem Server über $ http für serverseitige Optimierung verknüpfen? (2)

Das typeahead-Beispiel ( http://angular-ui.github.io/bootstrap/#/typeahead ) erwähnt, dass es einfach ist, ein Backend in diese Autocomplete zu implementieren, bietet aber kein Beispiel. Was mich besonders interessiert, ist die aktuell eingegebene Zeichenfolge herauszufinden, so dass ich diese an den Server senden und ein bereits gefiltertes Ergebnis zurücksenden kann - ich möchte diese Optimierung serverseitig machen und meine Abfragen minimieren, denke ich nicht zurück Die gesamte Ergebnismenge und das Ausschließen nicht übereinstimmender Elemente für die Anzeige ist für eine App mit mehr als 200.000 Einträgen in der Datenbank möglich.

Sollte ich in diesem Fall überhaupt Type-Ahead vergessen und eine benutzerdefinierte Lösung mit einem Drop-down implementieren, oder gibt es eine Möglichkeit, dies einfach zu tun?


Es gibt eine Möglichkeit, dies sehr einfach zu implementieren, keine Notwendigkeit, Ihre benutzerdefinierte Lösung auszurollen (zumindest nicht für diesen Fall!). Grundsätzlich können Sie jede Funktion als Teil des typeaheads Ausdrucks verwenden, zB:

<input type="text" ng-model="selected" typeahead="state for state in getStates($viewValue)">

Wie Sie in diesem Beispiel sehen können, kann die Methode getStates($viewValue) (definiert in einem Bereich) aufgerufen werden und $viewValue entspricht einem Wert, der von einem Benutzer eingegeben wurde.

Was ist das Beste hier ist, dass Ihre Funktion ein Versprechen zurückgeben kann und dieses Versprechen wird korrekt von der Typehead erkannt.

Vor einiger Zeit habe ich ein Beispiel-Plunk geschrieben, das zeigt, wie serverseitige Aufrufe zur automatischen Vervollständigung verwendet werden. Überprüfen Sie diese Plunk, die Autocomplete für alle Städte in USA zeigt (basierend auf geobytes.com), wo Städte live von einem JSONP-Dienst abgefragt werden:

http://plnkr.co/edit/t1neIS?p=preview

Sehen Sie sich ein funktionierendes Beispiel für die Filterung auf der Serverseite an (Sie müssen mindestens 3 Zeichen eingeben, um die Ergebnisse zu sehen). Natürlich sind Sie nicht auf Jsonp-Aufrufe beschränkt, Sie können jede Methode verwenden, die ein Versprechen zurückgibt.


Lassen Sie den Repräsentanten nicht kommentieren, um ihn als Antwort zu veröffentlichen (Entschuldigung!)

Wenn Sie eine neuere Bootstrap-Version verwenden, müssen Sie uib- vor typeahead hinzufügen (so)

<input type="text" ng-model="selected" uib-typeahead="state for state in getStates($viewValue)">