Wie AngularStrap typeahead Auswahl uneditable

Question

Ich verwende AngularStrap der typeahead Element machen:

<input type="text" ng-model="selectedFruit" bs-options="fruit for fruit in fruits" placeholder="Begin typing fruit" bs-typeahead> 

Wenn eine Frucht ausgewählt ist in der typeahead es angezeigt wird, in der typeahead als Zeichenfolge, die vom Benutzer bearbeitet werden kann. Ich möchte, dass der Benutzer das Obst nur mit seinem genauen Namen einreichen kann. Wenn ein Benutzer apple auswählt und dann die Zeichenfolge versehentlich aple ändert, stürzt meine App beim Senden ab.

Gibt es eine Möglichkeit, die Zeichenfolge in der Typeahead unkenntlich zu machen, sobald sie ausgewählt ist? Der Benutzer sollte in der Lage sein, seine Auswahl zu ändern, indem er eine andere Frucht aus dem Typahead-Array auswählt, so dass die erste Auswahl nicht unveränderbar sein sollte.

Answer 1

Also, abgehend über Lukes Vorschlag, die folgende Lösung ist das, was für mich gearbeitet:

HTML:

<div ng-repeat="pie in pies"> 
    <input type="text" bs-on-select="addSpelling" ng-blur="spellCheck()" bs-options="stock for stock in allBaskets" ng-model="pie.fruit" bs-typeahead> 
</div> 

Hinweis braucht es bs-on-select="addSpelling" und nicht bs-on-select="addSpelling()" sein, da die zweite Option wird verursachen die Funktion, die ausgelöst wird, wenn die Seite geladen wird.

In Controller:

$scope.addSpelling = function(){ 
    this.scope.spelling = this.scope.$modelValue; 
} 

$scope.spellCheck = function(){ 
    if(this.pie.fruit == ""{ 
     return; 
    } 
    if(this.pie.fruit != this.spelling){ 
     this.pie.fruit = this.spelling; 
    }  
}