Angular UI Bootstrap - 未选择Typeahead下拉值时清除模型值？

Question

我正在试图找出如何设置UI.Bootstrap Typeahead（http://angular-ui.github.io/bootstrap/）仅在从下拉列表中进行选择时设置模型值，如果没有选择则清除该字段。

如果存在不同的控制，那么这也会起作用。

Typeahead正在选择一个对象，如果用户只键入几个字符然后离开该字段，则将模型值设置为该字段的字符串值。我显然可以测试这种情况，但修改范围模型值不会刷新表单有效性。因此，如果我有一个必填字段，我还必须将字段的有效性设置为false。

这一切似乎都是某人必须已经想到的很多工作。有什么建议吗？

修改

我的另一个想法是，将Typeahead与提交回服务器的范围值分开是最佳做法吗？

Answer 1

我有类似的问题。我绕过它的方法是使用blur事件进行验证。

<input type="text" ng-model="yourModel" ng-blur="validateSelection()
  typeahead="item for item in list | filter:$viewValue"">

Answer 2

可接受的部分是好的解决方案。添加

 typeahead-select-on-blur="true" 

在输入框中输入

。它将使ng-model值（如果未键入整个术语）填充到您单击选择的typeahead下拉列表中的项。然后，您在validateSelection（）中对ng-model进行验证，验证整个术语很重要。关于“编辑”部分中的“另一个想法”。当您单击时，键入的内容消失时，可能不太友好。最好是保留它们，用户可以对其进行编辑。当您执行validateSelection（）时，可以将输入值标记为无效的表单验证。