I am trying to tell whether an item in an *ngFor
is the first or last element to style a container. Is there a way to do something like this?
<md-expansion-panel *ngFor="let item of items" *ngClass="{ 'first' : item.isFirst }">
<content></content>
</md-expansion-panel>
Thanks for any help offered!
Inside the ngFor
you have access to several variables:
So:
<md-expansion-panel *ngFor="let item of items; first as isFirst"
*ngClass="{ 'first' : isFirst }">
<content></content>
</md-expansion-panel>
Documentation at https://angular.io/api/common/NgForOf gives this example:
<li *ngFor="let user of userObservable | async as users; index as i; first as isFirst">
{{i}}/{{users.length}}. {{user}} <span *ngIf="isFirst">default</span>
</li>