Angular2 -

Załóżmy, że mam renderowanie tabeli z kontrahentami jak poniżej. Chciałbym teraz pod każdym wierszem z kontrahentem renderować wiersze opisujące usługi znajdujące się w customer.services. Znalazłem na stackoverflow, że mogę to zrobić (takie grupy wierszy) obejmując tr elementem template, gdzie będę robił ngFor http://stackoverflow.com/questions/35699962/how-to-use-angular2-templates-with-ngfor-to-create-a-table-out-of-nested-arrays Problem w tym, że jak to wpiszę u siebie to VS podpowiada, że tr nie może być zagnieżdżony w template i całość nie renderuje się. Jak to powinno być zrobione poprawnie?

      <tbody>
        <tr *ngFor="let customer of customers">
          <template [ngIf]="(showArchived && customer.isArchived == true) || customer.isArchived == false">
            <td><strong>{{ customer.customerCode }}</strong></td>
            <td><strong>{{ customer.name }}</strong></td>
          </template>
        </tr>
      </tbody>

Może zacznijmy od tego jakby to miało wyglądać w statycznym HTML

      <tbody>
        <tr "wiersz  z danymi kontrahenta 1">
            <td><strong>{{ customer.customerCode }}</strong></td>
            <td><strong>{{ customer.name }}</strong></td>
        </tr>
        <tr "usługa kontrahenta 1">
            <td><strong>{{ customer.customerCode }}</strong></td>
            <td><strong>{{ customer.name }}</strong></td>
        </tr>
        <tr "wiersz kontrahenta 2">
            <td><strong>{{ customer.customerCode }}</strong></td>
            <td><strong>{{ customer.name }}</strong></td>
        </tr>
        <tr "usługa kontrahenta 2">
            <td><strong>{{ customer.customerCode }}</strong></td>
            <td><strong>{{ customer.name }}</strong></td>
        </tr>
        <tr "usługa kontrahenta 2">
            <td><strong>{{ customer.customerCode }}</strong></td>
            <td><strong>{{ customer.name }}</strong></td>
        </tr>
      </tbody>

Rozwiązałem problem przez ngFor w tbody.

<tbody *ngFor="let customer of customers">

Poprawnie powinno być tak:

<tbody>
    <ng-container *ngFor="let customer of customers">
        <tr>
            ...
        <tr>
    </ng-container>
</tbody>