mikrofront/src/app/views/device_detail/radio-data/interface-bw.component.html

<c-card class="mb-1">
  <c-card-header>
    <h6>Radio data</h6>
  </c-card-header>
  <c-card-body>
    <h6>{{raddata.key}}</h6>
    <app-widgets-dropdown [devicedata]=raddata.value></app-widgets-dropdown>
    <c-row>
      <c-col md="3">
        <table style="word-break:  break-word" small stripedColumns cTable>
          <tbody>
            <ng-container *ngFor="let d of raddata.value['data'] | keyvalue ; let i=index">
              <tr *ngIf="i<objectlen(raddata.value['data'])/4">
                <th style="width: 20%;text-wrap: nowrap;">{{d.key}}</th>
                <td scope="row">{{d.value}}</td>
              </tr>
            </ng-container>
          </tbody>
        </table>
      </c-col>
      <c-col md="3">

        <table style="word-break:  break-word" small stripedColumns cTable>
          <tbody>
            <ng-container *ngFor="let d of raddata.value['data'] | keyvalue ; let i=index">
              <tr *ngIf="i>=objectlen(raddata.value['data'])/4 && i<(objectlen(raddata.value['data'])/4)*2">
                <th style="width: 20%;text-wrap: nowrap;">{{d.key}}</th>
                <td scope="row">{{d.value}}</td>
              </tr>
            </ng-container>
          </tbody>
        </table>
      </c-col>
      <c-col md="3">
        <table style="word-break:  break-word" small stripedColumns cTable>
          <tbody>
            <ng-container *ngFor="let d of raddata.value['data'] | keyvalue ; let i=index">
              <tr *ngIf="i>=(objectlen(raddata.value['data'])/4)*2 && i<(objectlen(raddata.value['data'])/4)*3">
                <th style="width: 20%;text-wrap: nowrap;">{{d.key}}</th>
                <td scope="row">{{d.value}}</td>
              </tr>
            </ng-container>
          </tbody>
        </table>
      </c-col>
      <c-col md="3">
        <table small stripedColumns cTable>
          <tbody>
            <ng-container *ngFor="let d of raddata.value['data'] | keyvalue ; let i=index">
              <tr *ngIf="i>=(objectlen(raddata.value['data'])/4)*3">
                <th>{{d.key}}</th>
                <td scope="row">{{d.value}}</td>
              </tr>
            </ng-container>
          </tbody>
        </table>
      </c-col>
    </c-row>
    <c-row *ngIf="raddata.value['strength-at-rates']">
      <c-col>
        <table style="word-break:  break-word" small borderless cTable>
          <tbody>
            <tr>
              <th
                style="text-wrap: nowrap;vertical-align: middle;padding: 5px;border-radius: 5px;background-color: #3399ff36;">
                Strength at rates</th>
              <td scope="row">
                <c-badge color="info" style="font-size: 0.85em;" class="mx-1"
                  *ngFor="let st of strangth_at_rate_extract(raddata.value['strength-at-rates'])">{{st}}</c-badge>
              </td>
            </tr>
          </tbody>
        </table>
      </c-col>
    </c-row>
  </c-card-body>
</c-card>