Is there a way to only display elements when a user uses a filter?
For instance:
$scope.elements = [{name : 'Pablo', age : 23}, {name : 'Franco', age : 98}];
<input type="text" ng-model="searchText" />
<div ng-repeat="element in elements | filter:searchText">
<p>{{ element.name }}</p>
</div>
I want the filtered list to be hidden if users haven't entered anything into the text input tag, or any other type of input like checkbox, radio, select...
The solution could involve using the ng-show directive.
<div ng-repeat="element in elements | filter:searchText" ng-show="searchText.length > 0">
<p>{{ element.name }}</p>
</div>
However, this approach doesn't seem ideal.
Do you have a better idea? Or perhaps a more native solution?
Thank you in advance.