Angular-Slickgrid：并非所有过滤器都出现在标题行中

Question

用于文档：我找到了问题和解决方法：

我们在数据集中使用数字ID（例如1,2,3，...）。在代码中的某个地方，网格变得混乱，并用id映射错误的列：当我用grid.getHeaderRowColumn（col.id）询问div并用col.id填充它时，它显示了一个不同的id，然后是col.id！不用说在同一时间没有找到所有的列（因此我无法解决的所有问题都不能设置为witch）。将id更改为字符串（“ id1”，“ id2”，“ id3”等）解决了该问题！

我不知道这是错误还是动态列不可能，但是现在仅使用字符串作为id即可。感谢@ghiscoding提供帮助。

原始问题：

我有这个奇怪的问题：

当我构建我的slickgrid时，并不是所有的列在标题行中都有一个filter-Input-box（尽管应该有，关于我的列定义）。

当我添加（删除）列时，其他过滤器框会显示/消失，而不会更改其他列定义。因此它似乎随机出现（尽管使用相同的列，但相同的过滤器会出现/消失）。

使用普通的slickgrid，我可以手动设置这些过滤器来纠正此问题。但是我该如何用angular-slickgrid做到这一点？

Anny建议？

我使用2.15.4版本的angular-slickgrid。

编辑

这是我的gridOptions和ColumnDefinitions。（它们是动态构建的，但这是在初始化网格之前通过dev-tools生成的）

columnDefinitions: {
    0: {id: 6, …}
    1: {id: 2, …}
    2: {
        id: 4
        fieldtype: "string"
        name: "deliveryaddressadditionalline"
        json_translate_property: null
        field: "deliveryaddressadditionalline"
        detailparams: {edit: true, tab: {…}, card: {…}}
        gridparams: {show: true, edit: false}
        filterable: true
        sortable: true
        type: 1
        editor: {model: ƒ}
        filter: {model: ƒ}
        grouping: {getter: "deliveryaddressadditionalline", collapsed: false, formatter: ƒ}
        rerenderOnResize: true
        }
    3: {
        id: "edit"
        name: ""
        field: ""
        width: 30
        formatter: ƒ (row, cell, value, columnDef, dataContext)
        onCellClick: (e, args) => { this.gotoDetailPane(e, args, detailInfo); }
        gridparams: {show: true}
        fieldtype: "edit"
        }
    4: {id: 1, fieldtype: "string", name: "id", json_translate_property: null, field: "id", …}
}

gridOptions: {
    enableColumnPicker: false
    headerMenu: {hideColumnHideCommand: true}
    enableGridMenu: false
    enableAutoResize: true
    autoResize: {containerId: "grid-container", sidePadding: 15}
    enableSorting: undefined
    autoEdit: false
    editable: true
    enableCellNavigation: true
    enableFiltering: true
    rowSelectionOptions: {selectActiveRow: true}
    enableRowSelection: true
    showHeaderRow: true
    showTopPanel: false
    enableDraggableGrouping: true
    createPreHeaderPanel: true
    showPreHeaderPanel: false
    preHeaderPanelHeight: 40
    draggableGrouping: {
        dropPlaceHolderText: "Drop a column header here to group by the column", 
        deleteIconCssClass: "fa fa-times", 
        onGroupChanged: ƒ, 
        onExtensionRegistered: ƒ
    }
    explicitInitialization: true
}

这就是结果（多种情况：列被混洗，过滤器在代码相同的情况下随机出现）：

Answer 1

我找到了问题和解决方案：

我们在数据集中使用数字ID（例如1,2,3，...）。在代码中的某个地方，网格感到困惑，并用id映射错误的列：当我用grid.getHeaderRowColumn（col.id）询问div并用col.id填充它时，它显示了一个不同的id，然后是col.id！不用说在同一时间没有找到所有的列（因此我无法解决的所有问题都不能设置为witch）。将id更改为字符串（'id1'，'id2'，'id3'，...）可以解决问题！

我不知道这是错误还是动态列不可能，但是现在仅使用字符串作为id即可。感谢@ghiscoding提供帮助。

Answer 2

注意，getHeaderRowColumn的前两行是

function getHeaderRowColumn(columnIdOrIdx) {
  var idx = (typeof columnIdOrIdx === "number" ? columnIdOrIdx : getColumnIndex(columnIdOrIdx));

因此，如果传递的参数是数字，则将其解释为列数组的基于0的索引（not id）。如果参数是字符串，那么将查找列数组索引，并将参数视为id。

因此您的解决方案是正确的；如果id是数字，则只需在将其传递之前将其转换为字符串即可。

[注意，在很多情况下，这对于javascript对象都是正确的：o[2]将尝试查找数组的第二个元素，而o['2']将查找对象属性'2'。上面的代码不依赖于对象，但是行为是相同的。