Asymmetrik/ngx-starter

<ng-container cdkColumnDef [sticky]="sticky()" [stickyEnd]="stickyEnd()">
    <th cdk-header-cell *cdkHeaderCellDef>
        <div class="header-text">
            {{ header() ?? (name | titlecase) }}
        </div>
        @if (headerTemplate(); as tpl) {
            <ng-template
                [ngTemplateOutlet]="tpl"
                [ngTemplateOutletContext]="{
                    header: header()
                }"
            />
        }
        <ng-content />
    </th>
    <td
        class=""
        [class.list-column-collapsed]="isCollapsed(item)"
        cdk-cell
        *cdkCellDef="let item; let index = index"
    >
        <div class="d-flex justify-content-between align-items-stretch">
            @if (item[name]?.length > 0) {
                <div class="list-column-collapsible">
                    @for (listItem of item[name]; track listItem) {
                        <div class="list-item text-nowrap">
                            <ng-template #defaultItemTemplate>
                                {{ listItem }}
                            </ng-template>
                            <ng-template
                                [ngTemplateOutlet]="itemTemplate() ?? defaultItemTemplate"
                                [ngTemplateOutletContext]="{
                                    listItem: listItem,
                                    item: item,
                                    index: item.index
                                }"
                            />
                        </div>
                    }
                </div>
            }
            @if (item[name]?.length > 1) {
                <div class="ps-auto">
                    <button class="btn btn-sm btn-link py-0" type="button" (click)="toggle(item)">
                        <span class="fa-solid fa-lg fa-angle-down"></span>
                    </button>
                </div>
            }
        </div>
    </td>
</ng-container>