Add active class on clicked item

HTML

<ng-container *ngFor="let tabData of data.list; let i = index">
    <a class="category-tabs-tab" 
        [ngClass]="{ active: activeTab == i }" 
        (click)="activeTab = i" 
        [routerLink]="tabData.routerLink">
    {{ tabData.name }}
    </a>
</ng-container>

TS

import { Component, Input, OnInit } from '@angular/core';

@Component({
  selector: 'kesma-nso-category-tabs',
  templateUrl: './nso-category-tabs.component.html',
  styleUrls: ['./nso-category-tabs.component.scss']
})
export class CategoryTabsComponent implements OnInit {

  activeTab = false;

  constructor() { }

  ngOnInit(): void { }

}

Mock

export const MockCategoryTabs = {
    activeTab: 0,
    name: 'Bajnokok Ligája',
    logoImage: 'https://picsum.photos/64/64',
    list: [
        { name: 'Főoldal', routerLink: ['/'] },
        { name: 'Mérkőzések / Események', routerLink: ['/'] },
        { name: 'Menetrend', routerLink: ['/'] },
        { name: 'Tabella', routerLink: ['/'] },
        { name: 'Átigazolások', routerLink: ['/'] },
    ],
  }