history.component.html

<div class="history">
    <div class="details">
        <div class=vertical></div>
        <div>{{userName}}'s history</div>
    </div>
    <div class="eventTotal">
        <div>
            <mat-tab-group>
                <mat-tab label="Workshop">
                    <div *ngFor="let workshop of eventsAttended">
                        <div *ngIf="workshop.isWorkshop" class="event">
                            {{workshop.eventName}}
                        </div>
                    </div>
                </mat-tab>
                <mat-tab label="Conference">
                    <div *ngFor="let workshop of eventsAttended">
                        <div *ngIf="!workshop.isWorkshop" class="event">
                            {{workshop.eventName}}
                        </div>
                    </div>
                </mat-tab>
            </mat-tab-group>
        </div>
    </div>
</div>