Javascript 如何使AngularStrap typeahead选择不可编辑

我正在使用AngularStrap的typeahead元素：

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

当在typeahead中选择水果时，它在typeahead中显示为用户可以编辑的字符串。我希望用户只能提交水果的确切名称。如果用户选择了

apple

，然后意外地将字符串编辑为

aple

，我的应用程序将在提交时崩溃

---

一旦选择了字符串，是否有办法使其在typeahead中不可编辑？用户应该能够通过从typeahead数组中选择另一个水果来更改其选择，因此第一个选择不应该是不变的。

因此，根据Luke的上述建议，以下解决方案对我有效：

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>

$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;
    }    
}