best way to trigger AngularJS ng-show

angularjs

Solution

ng-show works with any expression that results in a bool, so all you need to do is replace "tag" with "tag === ''", or some equivalent if your tag is going to be undefined or null.

If you only want to show when a certain key is pressed I would create another variable which you set to true when the down key is pressed and check for that also, e.g.

$scope.KeyPressed = false;
$scope.Tags = '';

$scope.ShowTags = function () {
    return $scope.KeyPressed && $scope.Tags !== '';
};

Then in you div:

<div ng-show="ShowTags()">

See jsfiddle for example

If you need to change any of the variables from within a jquery plugin you may need to use

$scope.$apply()

Problem

I'm building an autocomplete box in AngularJS. The relevant code looks like this ``` <input type="text" ng-model="tag"> <div ng-show="tag"> <ul> <li ng-repeat="t in user.tags | filter:{name:tag}"> <a>{{t.name}}</a> </li> </ul> </div> ``` I'd like to know what is the best way to show the list of suggestions when "tag" has no value (i.e. I want to show all the tags when the user press the down key. No need to mention the keypressing code on the answer).

Original source