<div class="list-container"> <div> <div *ngFor="let group of groupsObject" class="group-list-item d-flex justify-content-between mb-2 p-3"> <div class="subject-data"> <div> Name: {{ group.name }} </div> <div> Year: {{ group.year }} </div> <div> Admin: {{ group.admin.fullName }} ({{group.admin.userName}}) </div> </div> <div class="group-buttons d-flex align-items-center"> <button *ngIf="group.isUserInGroup" (click)="onShow(group.id)" class="btn btn-primary">Show</button> <button *ngIf="!group.isUserInGroup" (click)="onJoinRequest(group.id)" class="btn btn-primary">Send join request</button> </div> </div> </div> </div>