如何扎角的UI的预输入通过的$ HTTP服务器端优化的服务器?(How to tie angular

2019-08-21 09:53发布

该预输入例子( http://angular-ui.github.io/bootstrap/#/typeahead )提到它很容易实现后端到这个自动完成,但不提供的例子。 令我感兴趣的,特别是找出当前输入的字符串,这样我就可以发送到服务器并发送回一个已经过滤的结果-我想这样做优化的服务器端,尽量减少我的疑问,我不思归用于显示的整个结果集,只是不包括非匹配项具有在数据库200,000条目的应用程序是可行的。

我应该在这种情况下,完全忘了预输入并执行一个下拉菜单的定制解决方案,或者是有办法轻松地做到这一点?

Answer 1:

还有就是要实现这个很容易,没有必要推出定制解决方案的方式(至少不是这种情况!)。 基本上,你可以使用任何功能的typeaheads表达,前一部分:

<input type="text" ng-model="selected" typeahead="state for state in getStates($viewValue)">

正如可以从本实施例中看到getStates($viewValue)方法(在范围定义的)可被称为和$viewValue对应于由用户输入的值。

什么是最好的这里是你的函数可以返回一个承诺,这个承诺将通过预输入正确识别。

前一段时间我写了一个样本普拉克,演示如何使用服务器端的调用提供自动完成。 选中此普拉克显示自动完成了在美国的所有城市(基于geobytes.com),其中城市生活从JSONP服务查询:

http://plnkr.co/edit/t1neIS?p=preview

检查它如何做在服务器端过滤工作示例(需要键入至少3个字符才能看到效果)。 你当然不局限于JSONP调用,您可以使用任何返回一个承诺方法。



Answer 2:

不要有代表提出意见,以便张贴作为一个答案(对不起!)

如果您使用的引导的新版本,你需要在预输入前加上uib-(像这样)

<input type="text" ng-model="selected" uib-typeahead="state for state in getStates($viewValue)">


文章来源: How to tie angular-ui's typeahead with a server via $http for server side optimization?