Угловой - Скрыть элементы, если> 5 при повторении

Question

Угловой - Скрыть элементы, если> 5 при повторении

0

У меня есть список фильтров, в котором есть 50 элементов. Я просто хочу показать 5 предметов и скрыть остальные, чтобы сделать кнопку "Показать больше".

<ul>
    <li ng-repeat="a in filters.area">
         <input type="checkbox" ng-change="filter()" ng-model="a.checked"> {{ a.name }}
    </li>
</ul>
<span>SHOW MORE</span>

Luan Cuba 25 нояб. 2015, в 15:45

Источник

Теги:

javascript

html

angularjs

3 ответа

2

Использовать фильтр limitTo в AngularJS

{{ limitTo_expression | limitTo: limit: begin}}

Документация

Что-то вроде этого для вашего примера:

<ul>
    <li ng-repeat="a in filters.area | limitTo: 5">
        <input type="checkbox" ng-change="filter()" ng-model="a.checked">
        {{a.name}}
    </li>
</ul>
<span>SHOW MORE</span>

Arg0n 25 нояб. 2015, в 11:33

1

Посмотрите эту тему и этот демонстрационный плункер

<foo ng-repeat="item in items | limitTo: limit as results" n="{{item}}"></foo>
<button ng-hide="results.length === items.length" ng-click="limit = limit +2">show more...</button>

optimus 25 нояб. 2015, в 11:15

Ещё вопросы

Sajeetharan · Accepted Answer · 2015-11-25T11-23-00.000Z

Вы можете использовать LimitTo в Angular

 <li ng-repeat="n in numbers | limitTo:numLimit">{{n}}</li>

Вот пример JsFiddle