angular - How to add columnDefinitions into md-table from my component content -
i'm starting in angular 2 , didn't found this.
how said in title, i've component column definitions set in content, this:
<tabela-com-consulta [datasource]="ds"> <ng-container cdkcolumndef="id"> <md-header-cell *cdkheadercelldef md-sort-header >id</md-header-cell> <md-cell *cdkcelldef="let row">{{row.id}}</md-cell> </ng-container> <ng-container cdkcolumndef="nome"> <md-header-cell *cdkheadercelldef md-sort-header>name</md-header-cell> <md-cell *cdkcelldef="let row">{{row.name}}</md-cell> </ng-container> </tabela-com-consulta>
now component template:
<div id="ls" fxflexfill> <md-table [datasource]="datasource" mdsort> <!-- add each contentchildren of component <ng-container cdkcolumndef="id"> <md-header-cell *cdkheadercelldef md-sort-header>id</md-header-cell> <md-cell *cdkcelldef="let row">{{row.id}}</md-cell> </ng-container> --> <md-header-row *cdkheaderrowdef="displayedcolumns"></md-header-row> <md-row *cdkrowdef="let row; columns: displayedcolumns;"></md-row> </md-table> </div>
and component ts code:
@component({ selector: 'tabela-com-consulta', templateurl: 'tabela_com_consulta.component.html', styleurls: ['tabela_com_consulta.component.css'] }) export class tabelacomconsultacomponent<t> implements oninit, ondestroy, afterviewinit { [...] @contentchildren(cdkcolumndef) columndefinitions: querylist<cdkcolumndef>; ngafterviewinit() { } }
i can't figure out how use columndefinitions taken @contentchildren put in md-table content. , don't know if i'm doing right too. goal have column definitions in content of component , md-table. how that?
try this. don't know if work, worth shot.
<md-table [datasource]="datasource" mdsort> <!-- selectively pass content of 'tabela-com-consulta' --> <ng-content select="[cdkcolumndef]"></ng-content> <md-header-row *cdkheaderrowdef="displayedcolumns"></md-header-row> <md-row *cdkrowdef="let row; columns: displayedcolumns;"></md-row> </md-table>
Comments
Post a Comment