Состояние результатов углового фильтра js - PullRequest
0 голосов
/ 04 июня 2018

Я использовал фильтр в своем приложении, но хочу получить некоторые результаты:

  • Если результат фильтра друга не указан, показать сообщение о том, что он Нет друзей отлично работает

  • Если результат фильтрации друзей треков отсутствует, отобразится сообщение, что Нет треков

Я тоже хочу скрыть друзей, когда результат трекаnone

Я создал образец приложения на плунжере и соответственно отобразил соответствующее сообщение:

https://plnkr.co/edit/HaVGA4C2qnKjaBUOBlj0?p=preview

 <div ng-controller="repeatController">
   <p ng-show="results.length==0">
      No freinds
   </p>
   <p ng-show="play.length==0">
      No tracks
   </p>
   <input type="search" ng-model="q" placeholder="filter friends..." aria-label="filter friends" />
   <input type="search" ng-model="t" placeholder="filter tracks..." aria-label="filter friends" />
   <ul class="example-animate-container">
      <li  ng-repeat="friend in friends | filter:q as results track by friend.name">
         {{friend.name}} who is {{friend.age}} years old.
         <span  ng-repeat="data in friend.result | filter:t as play">
         <br> {{data.track}}.<br>
         </span>
      </li>
      <li  ng-if="results.length === 0"> 
         <strong>No results found...</strong>
      </li>
   </ul>
</div>

, если не выбран ни один трек, как я могу отобразитьсообщение Нет дорожек только один раз, как:

взято из приведенного выше кода, нужно:

<p ng-show="play.length==0">
     No tracks
</p>

Я хочу отобразить сообщение, когда фильтр возвращает ноль результатов,из всех дорожек друзей, т. е. поиск всех freinds.tracks и, если ни один не выбран, отобразить сообщение.

1 Ответ

0 голосов
/ 04 июня 2018

Вы должны создать собственный фильтр.Оценив несколько условий в одном фильтре, вы получите «производительность».

 $scope.filterData = function (item) {
 return (item.SECURITYCLASS === 90 || item.SECURITYCLASS === 93);
  }

На ваш взгляд:

 <div ng-repeat="item in data | filter:filterData">
{{::item}}
 </div>
...