AngularJS - ng-grid 数据不显示在列调整大小上

Question

我遇到了一个问题，即当列名更改时，ng-grid 数据不会在列大小调整时显示。

创建了一个 plunkr - http://plnkr.co/edit/eV9baoDOV9A46FZmKW8G?p=preview

请注意 main.js 中的以下函数，以显式更改列名和相应的数据。

$scope.reload = function(){
  $scope.columnDefinitions = [
      {field: 'first_col'},
      {field: 'second_col'}
    ];

  $scope.myData = [{first_col: "colData1", second_col: "colData2"},
                  {first_col: "colData3", second_col: "colData4"},
                  {first_col: "colData5", second_col: "colData6"}
                ];  
}

步骤-

场景 1（有效）。

1. 一旦示例完全加载，包括来自 ng-grid 的数据，请单击“更改”按钮。
2. 这样，“name”和“age”列将连同相应的数据一起更改为“first_col”和“second_col”。

场景 2（不起作用）

1. 重新运行示例。
2. 一旦示例完全加载包括来自 ng-grid 的数据，请稍微调整列的大小。
3. 调整大小后，点击“更改”按钮。
4. 现在网格显示为空。

真的被这个问题困住了。 任何帮助将不胜感激。

Answer 1

当您按下更改时，列的宽度似乎没有被拾起。如果您manually define it，它将起作用：

{field: 'first_col', width: 200},
{field: 'second_col', width: 200}

来自ng-grid documentation：

宽度也可以定义为百分比（20%、30%）、加权 *s 或“自动”（根据数据长度调整列的大小）（很像 WPF/Silverlight）/注意： “auto”目前仅适用于单页应用程序，因为调整大小发生在“document.ready”上。仍在努力改进这一点。

所以我猜它默认为“自动”，这就是它不起作用的原因。如果您尝试将“auto”（或任何基于 % 的内容）作为宽度，您也会收到错误消息。 我建议您在此期间使用一种解决方法。