Ng-show, когда длина массива равна нулю

Я начинаю заниматься AngularJS. Я пытаюсь отобразить "No Tag Found" во время процесса фильтрации с помощью " ng-show".

JS:

function simpleController($scope)
{
$scope.tags = ['HTML','CSS','Jquery','Bootstrap','AngularJS'];
}

HTML:

<div ng-controller="simpleController">
<input  class="txt" type="text" ng-model="nameText" /> 
<div>
 <ul>
  <li ng-repeat="myKeys in tags| filter:nameText">{{myKeys}}</li>
 </ul>
<div ng-show="!tags.length">No Tag Found</div>
</div>
</div>

Когда я ввожу любое значение, отличное от значений массива, я не могу получить "No Tag Found", используя вышеуказанный код. Пожалуйста помоги. Спасибо.

Ответы

Ответ 1

Если вы фильтруете свой ng-repeat, вы должны применить к нему тот же фильтр ng-show. Если вы этого не сделаете, ng-show всегда будет ссылаться на полный массив:

<div ng-show="!(tags| filter:nameText).length">No Tag Found</div>

Рабочая скрипка: http://jsfiddle.net/HB7LU/3149/

Ответ 2

Просто используйте ng-hide:

<div ng-hide="tags.length">No Tag Found</div>

Ответ 3

 <div class="box" ng-show="team_stores.length > 0" >

работал у меня

Ответ 4

простой способ создать фильтр... демо ниже

var app = angular.module('myApp', []);
app.controller('myctrl', function ($scope) {

    $scope.friends = [
      { name: "Peter", age: 20 },
      { name: "Pablo", age: 55 },
      { name: "Linda", age: 20 },
      { name: "Marta", age: 37 },
      { name: "Othello", age: 20 },
      { name: "Markus", age: 32 }
    ];

});

<!DOCTYPE html>
<html>
<head>
<title>welcome</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myctrl">
   Name: <input ng-model="filter" type="text" />
    <ul>
        <li ng-repeat="friend in friends |filter:filter">{{friend.name}}</li>

        <li ng-show="!(friends| filter:filter).length">data not found</li>
        <!--<link ng-repeat="friend in friends|filter:isActive ">-->
    </ul>


</body>
</html>

Ответ 5

Также вы можете попробовать использовать службу фильтрации, например: $filter('filter')(array, expression, comparator), эта служба возвращает новый массив.
вы можете увидеть http://code.angularjs.org/1.2.16/docs/api/ng/filter/filter