当前位置: 动力学知识库 > 问答 > 编程问答 >

javascript - How to toggle search results displayed in a li with AngularJS?

问题描述:

I've been searching methods to toggle a list that gets displayed when an user searches something in my app. What I want to do is have my search results hide whenever the search bar is closed. What would be the best way to do this? I believe I should do this with angular somehow but I'm out of ideas on how to do it. I tried the following jquery without success:

$("input").click(function(){

$("ul").toggle();

});

My codepen for this is: http://codepen.io/Feners4/pen/ZGZORX

网友答案:

as suggested by Rishi-Vedpathak add ng-blur as follows :

    input(type='text' ng-model='searchTxt' ng-change='autoComplete()' ng-blur='searchTxt=""')
--or--
    <input type="text" ng-model="searchTxt" ng-change="autoComplete()" ng-blur="searchTxt=''"/>

set ng-show on the tag as :

ul(ng-show='searchTxt && searchTxt!=""')
--or--
<ul ng-show="searchTxt && searchTxt!=''">
网友答案:

On search results list <div> or <ul> add ng-show="searchResults" or ng-show="isSearchResults()".

<div ng-show="isSearchResults()"></div>

In controller:

$scope.isSearchResults = function() {
return $scope.searchResults.length !== 0;
}
分享给朋友:
您可能感兴趣的文章:
随机阅读: