arrays - index - ngfor number

¿Cómo mostrar 1 elemento en ngFor en angular2?

Question

Tengo un ng simple Para eso recorre una matriz. Sin embargo, agregué la condición de que, aunque el índice sea < 5 continúe agregando la etiqueta. y Después de eso, quiero agregar una etiqueta adicional solo una vez que se utilizará un menú desplegable para ver el resto de las etiquetas. Pero no funciona.

<li *ngFor="let tag of module.Tags; let i = index">
<a *ngIf="i<5" href="#" class="span-tag tag">{{ tag }}</a>
<div *ngIf="module.Tags.length > 5 && i == 6">DropDown Button</div>
</li>

La característica aquí es que no quiero mostrar un número ilimitado de etiquetas para el usuario, quiero limitarlo a solo 5 etiquetas, y tengo un botón después de 5 etiquetas que se usarán para mostrar el menú desplegable con las etiquetas restantes.

¿Es esto posible en angular2?

Si es así, por favor, ilumíname.

Answer 1

<li *ngFor="let tag of module.Tags | slice:0:5; let last=last">
<a href="#" class="span-tag tag">{{ tag }}</a>
<div *ngIf="last">DropDown Button</div>
</li>

https://angular.io/docs/ts/latest/api/common/index/SlicePipe-pipe.html

Para obtener todo agregado, pero se agregó el <div>DropDown Button</div> después del quinto elemento que puede usar:

show = 5;
<li *ngFor="let tag of module.Tags|slice:0:show let i=index">
<a href="#" class="span-tag tag">{{ tag }}</a>
<div *ngIf="i==4 && show == 5" (click)="show = module.Tags.length">DropDown Button</div>
</li>