Angular with nested ng-container and ngFor

[luke...@gmail.com]

I haven't been able to get a nested loop of ng-containers to work.

        <ng-container *ngFor="let parentItem of parentItems">

            <tr parent-item-row [ParentItem]="parentItem">

            <tr child-item-row *ngFor="let childItem of parentItem.ChildItems" [ChildItem]="childItem">

        </ng-container>

        <ng-container *ngFor="let parentItem of parentItems">

            <tr parent-item-row [ParentItem]="parentItem">

            <ng-container *ngFor="let childItem of parentItem.ChildItems">

                <tr child-item-row [ChildItem]="childItem">

            </ng-container>

        </ng-container>

<ng-container *ngFor="let parentItem of parentItems">

            <tr parent-item-row [ParentItem]="parentItem">

            <ng-container *ngFor="let childItem of parentItem.ChildItems">

                <tr>

    <td>Test</td>

</tr>

            </ng-container>

        </ng-container>

<ng-container *ngFor="let parentItem of parentItems">

            <tr parent-item-row [ParentItem]="parentItem">

    <tr>

<td>Empty Row</td>

    </tr>

            <ng-container *ngFor="let childItem of parentItem.ChildItems">

                <tr>

      <td>Test</td>

</tr>

            </ng-container>

        </ng-container>

In the first two examples there's an error: Can't bind to 'ChildItem' since it isn't a known property of 'tr'.

In the third example when I replace the <tr child-item-row> with a normal tr it won't render the child items until I add a normal tr above the second container like in the fourth example.

[Sander Elias]

H iLuke,

I have to ask, do you have an @Input() ChildItem on your directive?

Regards

Sander