Element from a JSON is not output in mat-table

Question

I have a JSON:

{
    "monthlySusa": [
        [
            {
                "accountlinevaluesId": 1,
                "accountlineId": 1,
                "mandantKagId": 660,
                "mandantAccountsId": 1,
                "period": "7",
                "accountNumber": 27,
                "name": "EDV-Hardware/Software",
                "amount": 55.16859,
                "note": "Ich bin ein Kommentar!",
                "mandantKagAccountEntity": {
                    "mandantKagId": 660,
                    "mandantId": 1,
                    "kagNumber": "2000",
                    "kagText": "A. I. 1. EDV-Software"
                }
            }
        ]
    ],
    "success": true
}

I want to output amount in the column in the mat-table. I have written the following function:

public getOutputAmount() {
    const monthStr = `${this.month}`;
    this.balanceListService.getDataForMonthlyAmount(`${this.year}`, monthStr).subscribe(
      (resp: any) => {
        const data = resp.monthlySusa;
        if (data && data.length > 0) {
          const monthlySusaPeriods = resp.monthlySusa[0];
          const rows = [];
          for (const ac of monthlySusaPeriods) {
            const row = ac.amount;
            rows.push(row);
            console.log('Amount:', ac.amount);
          }
          this.dataSource.data = rows;
        }
      });
  }

My HTML

<table mat-table [dataSource]="dataSource" [hidden]="!isTableHasData">
              <div *ngFor="let column of displayedColumns; let i = index">
                <ng-container [matColumnDef]="column.attribute" [sticky]="freezeColumn(column.attribute)">
                  <!-- Table-Header -->
                  <th mat-header-cell class="toolbar-bg-second" id="table-header-font-second" *matHeaderCellDef>
                    <div>
                      {{ column.name }}
                    </span>
                    </div>
                  </th>
                  <!-- Table-Content -->
                  <td mat-cell class="table-content-bg-second" id="table-content-font-second" *matCellDef="let row; let i = index;" [ngClass]="{ 'disabled-ranges': column.disabledRanges, 'disabled-assignment': column.disabledAssignment}">
                    <div>
                      {{ column.object  !== null ? row[column.object][column.attribute] : row[column.attribute]  }}
                    </div>
                  </td>
                </ng-container>
              </div>

              <!-- Display columns -->
              <tr mat-header-row class="optimize-header-row"  *matHeaderRowDef="columns; sticky: true"></tr>
              <tr mat-row class="optimize-row" *matRowDef="let row; columns: columns;"></tr>
            </table>

The problem I have now is that I get console output but not in the table! Can you please help me and tell me what I am doing wrong or what I should improve in my code.