Question

我正在将Handsontable 0.34.5与AngularJS 1.6.5和ngHandsontable 0.13包装器一起使用。

我需要根据情况隐藏handsontable表列。

我尝试使用ng-show或ng-hide指令执行此操作，但是它不起作用。

0.34.5版本似乎不支持

Handsontable HiddenColumns 插件。

代码如下：

<hot-table settings="tableSettings" datarows="items">
    <hot-column ng-show="false" data="id" title="'ID'"></hot-column>   
</hot-table>

这里是demo。

我如何隐藏带有角度指令的handontable？

UPDATE ：

当前，我正在使用ng-if指令。但是它有一个我不满意的问题：当条件为true且在表的末尾添加了列时（而不是在指定位置），它会重新创建DOM。签出here

Answer 1

您可以使用ng-if指令隐藏列

<hot-table settings="tableSettings" datarows="items">
    <hot-column ng-if="false" data="id" title="'ID'"></hot-column>   
</hot-table>

Demo

Answer 2

要操作列，请避免使用<hot-column>指令。而是使用columns属性：

<hot-table col-headers="true" 
           datarows="ctrl.data" 
           columns="ctrl.columns">
</hot-table>

this.columns = [
    { data: 'id',    title: 'ID',    readOnly: true  },
    { data: 'name',  title: 'Name',  readOnly: true  },
    { data: 'price', title: 'Price', readOnly: false }
];


var deletedName;  
this.hideName = function() {
    deletedName = this.column.splice(1,1);
};
this.showName = function() {
    this.column.splice(1,0,deletedName);
};

ng-show在handontable列中不起作用

2 个答案: