Как перебирать массив только до некоторых объектов, используя ngFor в angular 2

Я перебираю массив, который имеет 6 объектов, и использую ngFor, где я хочу зациклить только до 4 элементов. Как я могу это сделать??

<div class="item active" *ngFor="#data of lengthArray">
 content 
</div>

В LengthArray у меня 6, но как зациклить только до 4 записей??

а также я хочу перейти от 4-й записи к 6-й записи в другом div. Как я могу начать с 4-й записи??


angular html ngfor
person sudhir    schedule 30.06.2016    source источник

Ответы (3)


arrow_upward
24
arrow_downward

Вы можете использовать срез-канал с < em>start и end. Начальный параметр является обязательным, а конечный параметр является необязательным.

<div class="item active" *ngFor="#data of lengthArray | slice:start[:end]">
  content 
</div>
person muetzerich    schedule 30.06.2016
comment
можем ли мы иметь условие внутри? Например, когда data.index == 1, тогда start должен быть 4? - person sudhir; 30.06.2016

arrow_upward
3
arrow_downward

Вы можете захватить индекс, а затем сделать его меньше 4

<div class="item active" *ngFor="#data of lengthArray;i=index">
    <div *ngIf="i<=4">
        content
    </div>
</div>

Я действительно не тестировал код, но вы можете найти много примеров здесь, в stackoverflow, поищите больше...

Angular 2: как применить лимит к *ngFor?

Подробнее о фильтрах... Как применить фильтры к *ngFor

person Marko    schedule 30.06.2016
comment
Спасибо, я применил условие, такое же, как и выше, фрагмент ответа: [i+1]:[i+4] вот так - person sudhir; 30.06.2016
comment
это создаст 4 внешних элемента ‹div› с внутренними элементами ‹div›, а затем избыточное количество пустых внешних элементов ‹div› - person jiroch; 11.10.2018

arrow_upward
0
arrow_downward

Простое решение:

<tr *ngFor=""let obj of ArrayogObjs;  let i=index">
        <td *ngIf="i<4">
            {{obj.name}}
        </td>
    </tr>
person Shashwat Gupta    schedule 08.02.2018
comment
это создаст 4 элемента ‹tr› с ‹td› внутри, а затем избыточное количество пустых элементов ‹td› - person jiroch; 11.10.2018