Количество отфильтрованных объектов в ng-repeat [дубликаты]

Я использую angularjs на сайте, и у меня есть поисковый ввод, который фильтрует список в представлении. Этот список отображается с помощью ng-repeat, у которого есть фильтр из ввода поиска:

Поисковый ввод:

<input type="text" placeholder="Device Search" class="form-control hasclear" 
  ng-model="searchText"/>

А вот ng-repeat:

<tr ng-click="openModal(device['device_id'], device)" 
  ng-repeat="device in devices | filter:searchText | orderBy:predicate:reverse">

Как вы видите, фильтр в ng-repeat имеет фильтр, который использует переменную searchText из ng-модели. Я хотел бы знать, можно ли узнать, сколько объектов было найдено, когда пользователь вводит текст в поле поиска (сколько устройств ng-repeat отображает при фильтрации). Например: 0 devices were found, 3 devices were found...

Есть ли способ отобразить эту информацию по тому, как я построил этот поиск?


javascript angularjs angularjs-ng-repeat angularjs-ng-model ng-repeat
person Joab Mendes    schedule 24.02.2015    source источник
comment
Я пытался найти что-то здесь, но не смог. Я должен удалить его здесь? @isherwood   -  person Joab Mendes    schedule 25.02.2015
comment
Не обязательно. См. meta.stackexchange.com/questions/230/   -  person isherwood    schedule 25.02.2015

Ответы (4)


arrow_upward
2
arrow_downward

Если вам это нужно вне вашего тега <tr>, я бы сделал это так:

<tr ng-click="openModal(device['device_id'], device)" 
ng-repeat="device in filteredResults = (devices | filter:searchText | orderBy:predicate:reverse)">

{{filteredResults.length}} devices were found
person dave    schedule 24.02.2015
comment
Это то, что мне было нужно, спасибо! - person Joab Mendes; 25.02.2015

arrow_upward
2
arrow_downward

ИЗМЕНИТЬ:

Основываясь на правильном ответе Дэйва, вы должны присвоить переменную отфильтрованному результату, как

<tr ng-click="openModal(device['device_id'], device)" 
ng-repeat="device in filtered_devices = (devices | filter:searchText | orderBy:predicate:reverse)">

Затем под вашим тегом tr вы можете ввести:

<div>{{filtered_devices.length + ' devices were found'}}</div>

Пример Plunkr здесь

person thank_you    schedule 24.02.2015
comment
это не будет отображать отфильтрованную длину, только общее количество исходного массива - person charlietfl; 25.02.2015
comment
Что мне не хватает? У меня есть пример plunkr, и он отлично работает. - person thank_you; 25.02.2015
comment
конечно, отредактированная версия работает, но комментарий был сделан до редактирования - person charlietfl; 25.02.2015

arrow_upward
1
arrow_downward

с таким фильтром, как filter:x as result, результирующая коллекция сохраняется в переменной result.

Итак, вы можете сделать:

<tr ng-click="openModal(device['device_id'], device)" ng-repeat="device in devices | filter:searchText as filteredCollection | orderBy:predicate:reverse">
  <td><span>Filtered collection size: {{filteredCollection.length}}</span><td>
</tr>
person cefigueiredo    schedule 24.02.2015

arrow_upward
0
arrow_downward

Я уверен, что есть возможность со свойствами:

  • $последний
  • $индекс

что-то типа:

<span ng-if="$last" > {{$index}} devices found </span>

документация: https://docs.angularjs.org/api/ng/directive/ngRepeat

person Joniras    schedule 24.02.2015