angularjs - 有没有办法动态设置Angularjs ui-grid的col宽度？

Question

有没有办法以编程方式动态更改 Angularjs ui-grid 中列的宽度？

我试过改变 $scope.gridOptions.columnDefs[i].width，但它没有任何效果。

我问是因为我设置了 ui-grid-resize-columns 指令，允许用户调整最初设置为百分比宽度的列的大小。但是一旦用户进行了任何手动修改，列大小都将变为静态，不再随着整个表格宽度而增长或缩小。

我想添加一个“自动调整”按钮，允许用户将列大小定义恢复为百分比(基于他们当前手动设置的比例)，加起来为 100%。理想情况下，列将再次开始调整以适应表大小的变化。

我只能看到用户定期按 F5 以获得这种效果(我会!)，不知不觉地导致整个页面从头开始重新加载，不必要地消耗了大量的服务器资源。我想一个不愉快的选择是从一开始就让它们静止，消除这种诱惑!

Answer 1

更改 columnDef 宽度不起作用，因为 GridColumn 已经从 columnDefs 构建，而 ui-grid 只监视对 columnDefs 数组的更改，而不是单个 columnDef 属性。您可以做的是在列的 GridColumn 对象上设置新的列宽。这对我有用。

    $scope.grid.getColumn('my-column').width = $newWidth;
    $scope.grid.refresh();

您还可以删除并重新添加具有更改的宽度属性的列，因为这应该触发网格从 columnDefs 重建 GridColumns，尽管我没有测试过这个，而且前者似乎更容易。