Я пытаюсь спроецировать контент в расширенную строку, но пока безуспешно.
Тот же подход работает везде, не знаю, почему он не работает с mat-table.
<!-- Expanded Content Column - The detail row is made up of this one column that spans across all columns -->
<ng-container matColumnDef = "expandedDetail">
<td mat-cell *matCellDef = "let element" [attr.colspan] = "columnsToDisplay.length">
<div class = "example-element-detail"
[@detailExpand] = "element == expandedElement ? 'expanded' : 'collapsed'">
<div class = "example-element-description">
{{element.description}}aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
<span class = "example-element-description-attribution"> -- Wikipedia
<ng-container [ngTemplateOutlet]='rowDetail'></ng-container></span>
</div>
</div>
</td>
</ng-container>
И в использовании пробовал
<demo-table
[rowDetail] = "rowDetailContent "
></demo-table>
<ng-template #rowDetailContent >
This is a passed template
</ng-template>
и это
<demo-table
[rowDetail] = "details "
></demo-table>
TS
@ViewChild('rowDetailContent') details :TemplateRef<any>;
Кажется, ни один из них не работает.
Вот Stackblitz





Глядя на свой AppModule
entryComponents: [TableExpandableRowsExample,TableDemoComponent,RowDetailContent],
declarations: [TableDemoComponent,TableExpandableRowsExample,RowDetailContent],
bootstrap: [TableExpandableRowsExample,TableDemoComponent,RowDetailContent],
Я подозреваю, что вы не знаете, какова цель этих опций.
Попробуйте удалить TableDemoComponent и RowDetailContent из опции bootstrap, так что это должно быть:
bootstrap: [TableExpandableRowsExample]
Вот некоторая документация о том, что на самом деле означают здесь свойства: angular.io/guide/bootstrapping