默认列未显示在 Material 设计数据 Table (iamisti/mdDataTable)

Question

我正在尝试使用来自控制器的数组动态填充 <mdt-header-row> 内部的 <mdt-column>。这段代码似乎无法正常工作：

hide-column-by-default="c.selector_hidden"

加载时 table 默认列不显示。某些列被设置为默认值并被排除在 "column-selector" 之外，因此即使在 selecting select 中的所有列之后，这些列也不会显示。

当我在 table-card 中设置 ...columnSelector: false}... 时，它会显示我的列，但是 select 列的功能消失了！？

我该如何解决这个问题？

这是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>

数据来自控制器中的这个数组：

$scope.tableHeader = [
        {
            name: 'Dessert (100g serving)',
            definition: '',
            align: 'left',
            sort: true,
            sort_default:false,
            hidden: false,
            selector_exclude:false,
            selector_hidden:false
        },...

我还为它创建了一个分支： https://codepen.io/anon/pen/JJQyKN?editors=1111

Answer 1

This piece of code doesn't seem to work properly:

hide-column-by-default="c.selector_hidden"

那是因为您的 tableHeader 数组中的任何对象都没有 selector_hidden 属性。它应该看起来像这样：

$scope.tableHeader = [
        {
            name: 'Dessert (100g serving)',
            definition: '',
            align: 'left',
            sort: true,
            sort_default:false,
            hidden: false,
            selector_exclude:false,
            selector_hidden:true
        },...

Answer 2

实际上问题出在这个指令本身。我必须修改 md-data-table.js 文件并将 "isVisible" 引用列更改为 true。我还将 isHidden 属性更改为 "isVisable" 因为这是 md-data-table-templates.js 文件引用的内容。我进一步修改了代码以符合我们的要求，因此无法提供特定的补丁。不过很遗憾这个项目好像被开发商放弃了。

默认列未显示在 Material 设计数据 Table (iamisti/mdDataTable)

Default Column are not displayed in Material Design Data Table (iamisti/mdDataTable)

javascript

angularjs

angular-datatables