2016-04-18 13 views
1

Ich habe folgende Steuer definiert:Angular typeahead löst nicht auf Leerzeichen

<input     id="inputSearchMovies" 
         type="search" 
         ng-model="filterItems" 
         placeholder="Search for movies ..." 
         typeahead="prediction for prediction in getPredictions($viewValue) | limitTo:10" 
         typeahead-min-length='1' 
         typeahead-on-select='onSelectPart($item, $model, $label)' 
         typeahead-template-url="customTemplate.html" 
         class="form-control shortInputSearch" 
         style="width: 98% !important" /> 

Dies wird auf die Bootstrap getPredictions Funktion, die einen Aufruf durchführt, wie I-Typ.

Das Problem ist die typeahead Mechanismus nicht aufgerufen wird, wenn ich Eingabe Leerzeichen:

  • "Lawrence of Arab" -> Eingabe von "i", ok funktioniert (ruft Vorhersage-Funktion): "Lawrence von Arabi"
  • „Lawrence of Arab“ -> Tipp Raum verursacht keine Vorhersage Aufruf: „Lawrence von Arab“ (keine an den Server Anruf)

Wie kann ich das Problem beheben einen Anruf auf jedes Zeichen Änderung auszuführen (Leerzeichen oder nicht)?

Antwort

2

Ihr Problem kommt eigentlich nicht von ui-bootstrap, es kommt von der Art und Weise Winkelgriffe input s. Es schneidet automatisch den Wert input, bevor es den Wert ng-model setzt. Da der Wert derselbe ist wie zuvor (seit der Trimmung), wird dies nicht als Wertänderung betrachtet. Daher wird nicht die ngModelController$parsers aufgerufen, die ui-bootstrap verwendet, um "getMatchesAsync" auszulösen. (oder Ihr "typeahead Mechanismus").

nicht aber keine Angst Ich kann diese Funktionalität durch verwenden ng-trim wie so ausgeschaltet:

<input typehead... ng-trim="false"></input> 

Hier ist sie in Winkel docs unter Argumente ngTrim: https://docs.angularjs.org/api/ng/input/input%5Btext%5D

Wenn auf false gesetzt Angular schneidet die Eingabe nicht automatisch ab. Dieser Parameter wird für Eingabe-Steuerelemente [type = password] ignoriert, die den Eingang niemals beschneiden. (default: true)



weiß, dass ich der Titel schon sagt type=text, aber ich sah auf den Winkelcode und dieses Attribut gilt auch für type=search. Ich kann diesen Code bei Bedarf zeigen.

+0

Danke Kumpel. Klappt wunderbar! –