То, что я хочу, изображено на следующем рисунке. Я использую Angular Material (7.x) и использую реализацию Mat-Table, как описано здесь: https://material.angular.io/components/table/overview
В приведенном выше сценарии для бизнеса показано несколько счетов-фактур.
Я уже использовал Mat Table of Angular для использования нескольких строк для одной строки, и это работает. Но теперь я также должен сделать так, чтобы первая строка (Тип A) имела несколько строк в таблице с несколькими строками.
У меня есть несколько идей о том, как это сделать, но я не хочу начинать и знать заранее, будет ли решение работать или нет.
Я начал перебирать объекты в salesInvoices:
<tr mat-header-row *matHeaderRowDef="displayedPurchaseInvoiceColumns"></tr>
<ng-container *ngFor="let item of invoices.salesInvoice">
<tr mat-row class="table-first-row" *matRowDef="let row; columns: displayedSalesInvoiceColumns"></tr>
</ng-container>
<tr mat-row class="table-second-row" *matRowDef="let row; columns: displayedPurchaseInvoiceColumns"></tr>
Это не показывает ничего полезного. Я думаю, что он даже ничего не делает, так как я вижу только выставленные счета-фактуры, а не счета-фактуры.
Я думал об использовании таблицы матов для первого ряда? Я понятия не имею, как я могу это сделать, но я также не уверен, сработает ли это.
Я действительно хочу, чтобы это работало с Mat-Table, но я боюсь, что я не смогу заставить его работать с библиотекой Материалов и придется сделать что-то нестандартное.
Любая помощь приветствуется! Если мне нужно предоставить больше информации, пожалуйста, скажите мне.