Table example.component.html

Only Added Content

<!-- Only added content -->
<mat-button-toggle-group
  #toggleButton="matButtonToggleGroup"
  name="view"
  aria-label="View"
  value="card"
>
  <mat-button-toggle value="card">Cards</mat-button-toggle>
  <mat-button-toggle value="table">Table</mat-button-toggle>
</mat-button-toggle-group>

@if (!loading && toggleButton.value === 'card'){
<!--  -->
@for (github of searchResult.items; track github) {
<mat-card>
  <mat-card-header>
    <mat-card-title>{{ github?.full_name }}</mat-card-title>
    <mat-card-subtitle>{{ github?.full_name }}</mat-card-subtitle>
  </mat-card-header>

  <mat-card-content>
    <p>
      <b>URL:</b> {{ github?.html_url }}
      <br />
      <b>License:</b> {{ github?.license?.name }}
      <br />
      <b>Watchers:</b> {{ github?.watchers_count }}
      <br />
    </p>
  </mat-card-content>
</mat-card>
}
<!--  -->
}