I am trying to populate the <mdt-column> inside of <mdt-header-row> dynamically with an array from controller. This piece of code doesn't seem to work properly:
hide-column-by-default="c.selector_hidden"
When loading the table default columns are not displayed. Some columns are set as default and are excluded from the "column-selector", so even after selecting all columns in the selector these columns are not displayed.
When i set ...columnSelector: false}... in table-card it shows me my columns, but the functions to select column is gone!?
How can i fix this?
This is the mdt-header-row:
<mdt-header-row> <mdt-column hide-column-by-default="c.selector_hidden" exclude-from-column-selector="c.selector_exclude" column-sort="c.sort" sortable-rows-default="c.sort_default" column-key="{{c.key}}" align-rule="{{c.align}}" column-definition="{{c.definition}}" ng-repeat="c in tableHeader"><span>{{c.name}}</span></mdt-column> </mdt-header-row> The Data is comming from this Array in controller:
$scope.tableHeader = [ { name: 'Dessert (100g serving)', definition: '', align: 'left', sort: true, sort_default:false, hidden: false, selector_exclude:false, selector_hidden:false },... I also created a fork for it: https://codepen.io/anon/pen/JJQyKN?editors=1111
1 Answers
Answers 1
This piece of code doesn't seem to work properly:
hide-column-by-default="c.selector_hidden"
That's because you don't have a selector_hidden property in any of the objects in your tableHeader array. It should look something like this:
$scope.tableHeader = [ { name: 'Dessert (100g serving)', definition: '', align: 'left', sort: true, sort_default:false, hidden: false, selector_exclude:false, selector_hidden:true },... 
0 comments:
Post a Comment