Is there a way to extend a mat-table that automatically includes the matSort directive (and other custom directives that interact with the columns, like filter) and still have the content inside hold the mat-sort-header directives?
<mat-table [matSortActive]="sortActive" [matSortDirection]="sortDirection" matSort>
<ng-content></ng-content>
</mat-table>
Here is an example: https://stackblitz.com/edit/angular-bxsavu.
I've tried creating a component on its own that just puts <ng-content> inside the <table> element, but that creates the error:
DwfTableComponent.html:1 ERROR Error: Missing definitions for header, footer, and row; cannot determine which columns should be rendered. at getTableMissingRowDefsError (table-errors.ts:48)
I've tried adding nothing to the entire template and just using the original CDK_TABLE_TEMPLATE (seen in the stackblitz link above), and this creates the error:
ERROR TypeError: Cannot read property 'viewContainer' of undefined at DwfMatTableExtendedComponent.CdkTable._forceRenderHeaderRows (table.ts:854)
So it seems like I can't really get any traction on making this work.
The context of this all is that our site has many tables that need to sort, but we need developers to be able to write in what columns are sortable when writing the markup. If I can get this to work for MatSort, I can then turn and apply this to my own server side filtering component that behaves very much like the MatSort feature (has a customFilter directive in the <table> element, and within the <th mat-header-cell *matHeaderCellDef> spot there is a custom-filter-header directive). And then the big piece of it will be another feature that lets the table change what cells display (links or text) when the table is "paused" -- another feature that is controlled by the wrapper but needing to affect the inside content.
There are many other features in our current "table-wrapper" (search windows, exports, paging), but this one part of it has been a constant source of confusion. There's something a little broken feeling when I can't make a component that is made of two well known components and still leaves the table structure flexible. I'm sure I'm missing some piece of it, but this would greatly reduce the repetition of code for each table we have to write.
