7

我有一个使用AngularUI's typeahead feature的文本字段。它看起来像这样:Angular-UI:Force Typeahead结果

<input typeahead="eye for eye in autocomplete[column] | filter:$viewValue"> 

我想强制用户从生成的列表中选择一个选项。如果他们输入的内容完全不在显示的列表中,请在模糊处单击(在文本字段外部单击),我希望文本字段的值重置为原始值。

此功能是typeahead指令的一部分,还是我需要扩展它?我搜索了大约10分钟的谷歌和stackoverflow,但无法找到任何相关的文件。

任何人都可以请指出我在正确的方向来完成此?

+0

还有第二个参数来过滤启用完全匹配,也许它可以使它工作? '过滤器:$ viewValue:真' – jpmorin 2014-09-10 20:11:25

+0

嗯,这打破了我的页面上的类型。是否需要某个版本的Angular? – 2014-09-10 20:13:12

+0

Ui-Boostrap中还有一个属性用于强制现有结果:typeahead-editable =“false”(typeahead-editable(默认值:true):是否应该将模型值限制为仅从弹出窗口中选择的值?) – jpmorin 2014-09-10 20:14:45

回答

12

插件中只有一个属性强制只存在现有值:typeahead-editable="false"。默认值是true

只有$modelValue被设置为空时,如果选择了一个错误的值,这实际上是必要的,否则我们将无法写任何东西。 $viewValue保留最后输入的文字。您可能能够将自己的模糊事件绑定到该字段以重置$viewValue

这里是显示所选择的价值你的jsfiddle:http://jsfiddle.net/ZjPWe/61/

您也可以使用这需要一个回调时选择了值的属性typeahead-on-select,但我不知道它会与typeahead-editable="false"工作,因为没有值被选中。