La lista se completa dinámicamente y el ancho de cada texto de la lista puede variar... también es un texto pequeño o más grande. Aquí me gustaría mostrar el enlace 'Editar' que debería mostrarse después del último elemento de la lista. Aquí está el código de muestra que probé
<ul class="" *ngIf="" > <ng-container *ngIf=""> <li *ngFor="let emppData of getEmpData(); let i = index; let test = test11123"> <span class="day-label">{{ emppData.day }}</span> <span *ngIf="emppData.emppData">{{ emppData.empLabel }}</span> </li> <li *ngIf="isTaestable$ | async"> <button id="idTestButton" [disabled]="false" buttonSize="md" buttonStyle="link" aria-label="Edit" (click)="testEmpData()" > {{ edit }} </button> </li> </ng-container> </ul>Salida de muestra:
Sunday AAAA Monday BBBB Tuesday CCC. 'Edit'Utilice *ngFor variables. Referencia
Detalles adicionales de Maxime Chevallier :
Para completar la respuesta, let last = last en *ngFor es un booleano dado por Angular que es verdadero cuando el elemento es el último elemento de la matriz. referencia
<ul class="" *ngIf="" > <ng-container *ngIf=""> <li *ngFor="let emppData of getEmpData(); let i = index; let test = test11123;let last = last;"> <span class="day-label">{{ emppData.day }}</span> <span *ngIf="emppData.emppData">{{ emppData.empLabel }}</span> </li> <li *ngIf="isTaestable$ | async"> <button *ngIf="last" id="idTestButton" [disabled]="false" buttonSize="md" buttonStyle="link" aria-label="Edit" (click)="testEmpData()" > {{ edit }} </button> </li> </ng-container> </ul>Añadir última declaración. Como ha hecho con let=index, puede declarar todos los siguientes vars: index primero último par impar
Entonces su código debería funcionar con:
<ul class="" *ngIf="" > <ng-container *ngIf=""> <li *ngFor="let emppData of getEmpData(); let i = index; let test = test11123; let last = last"> <span class="day-label">{{ emppData.day }}</span> <span *ngIf="emppData.emppData">{{ emppData.empLabel }}</span> </li> <li *ngIf="isTaestable$ | async"> <button *ngIf="last" id="idTestButton" [disabled]="false" buttonSize="md" buttonStyle="link" aria-label="Edit" (click)="testEmpData()" > {{ edit }} </button> </li> </ng-container> </ul>Verifique otras preguntas con su mismo problema: Angular 2 ngfor first, last, index loop