angularjs – 角度js中的搜索框

前端之家收集整理的这篇文章主要介绍了angularjs – 角度js中的搜索框前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想在我的angularJs应用程序中实现一个搜索框。一旦用户搜索框中输入一些名称,应该调用一些REST服务,并且应该获取搜索文本框中输入的名称相匹配的所有名称。请注意,没有按钮,一旦用户开始输入,结果就会自动进入。 REST服务已经在那里了。当用户开始输入并将结果作为列表返回时,我只需要调用REST服务。
例如: – 如果我输入詹姆斯,那么名字以James开头的所有用户都应该在搜索框中列出。

一旦名单出现,用户可以点击其中一个名称,他的信息应该加载到当前页面中。

如何在角度js中实现这种类型的搜索框?有没有指示?任何人都可以给我一些方向。

你应该定义一个监听onkeypress的指令。 @H_404_10@app.directive('myOnKeyDownCall',function () { return function (scope,element,attrs) { element.bind("keydown keypress",function (event) { scope.$apply(function (){ scope.$eval(attrs.ngEnter); }); event.preventDefault(); }); }; });

HTML

@H_404_10@<input type="text" my-on-key-down-call="callRestService()">

CONTROLLER

@H_404_10@$scope.callRestService= function() { $http({method: 'GET',url: '/someUrl'}). success(function(data,status,headers,config) { $scope.results.push(data); //retrieve results and add to existing results }) }

将会很高兴等到3键已经输入,在指令中:

@H_404_10@var numKeysPress=0; element.bind("keydown keypress",function (event) { numKeysPress++; if(numKeysPress>=3){ scope.$apply(function (){ scope.$eval(attrs.myOnKeyDownCall); }); event.preventDefault(); } });

也许,存在你可以使用的角色的头像指令:
angular-ui typeahead我希望它能帮助你

原文链接:https://www.f2er.com/angularjs/144719.html

猜你在找的Angularjs相关文章