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

Question

我试图弄清楚如何拥有UI。BootstrapTypeahead（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（）时，可以将输入值标记为无效的表单验证。