import { Component, OnInit } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { Court } from '../../core/court'; import { CourtListDataSource } from './court-list-datasource'; @Component({ selector: 'app-court-list', templateUrl: './court-list.component.html', styleUrls: ['./court-list.component.css'], }) export class CourtListComponent implements OnInit { list: Court[] = []; dataSource: CourtListDataSource = new CourtListDataSource(this.list); /** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */ displayedColumns = ['name']; constructor(private route: ActivatedRoute) {} ngOnInit() { this.route.data.subscribe((value) => { const data = value as { list: Court[] }; this.list = data.list; }); this.dataSource = new CourtListDataSource(this.list); } }