Question

我使用分组功能创建了一个使用ngTable的应用程序，该应用程序工作正常，但问题是当我向表中添加动态数据（行）时，它不会动态反映，除非我们点击表格标题用于排序或单击分页时

我已经在一个plunker中重新创建了这个问题，在那里你可以找到一个按钮，当点击一个动态行但是没有反映在表格中

  <body ng-app="main" ng-controller="DemoCtrl">
  <button ng-click="addDynamicDatas()">Add Datas</button>
    <table ng-table="tableParamsOne" class="table">
      <tbody ng-repeat="group in $groups">
        <tr class="ng-table-group" ng-hide="group.data[0].role==='None'">
          <td>
              <strong>{{ group.value }}</strong>
          </td>
        </tr>

        <tr ng-repeat="user in group.data">
          <td sortable="name" data-title="'Name'">
               <span ng-class="{'bold-text': user.role=='None'}" ng-show="user.role==='None'"> {{user.name}}</span>
            </td>
          <td sortable="age" data-title="'Age'">
                {{user.age}}
            </td>
        </tr>
      </tbody>
    </table>
  </body>

添加功能

$scope.addDynamicDatas = function()
{
   $scope.myDataOne.push({name: "Abcd", age: 10, role: 'Administrator'});
}

有人可以告诉我一些解决方案吗？

Answer 1

这可能不是一个理想的解决方案，但却是我唯一能找到的解决方案。

您可以在更新阵列后添加$scope.tableParamsOne.reload();。

此外，当您单击标题时更新网格时，它不会更新分页中的页面数量。要解决此问题，您可以添加$scope.tableParamsOne.total($scope.myDataOne.length);

Answer 2

我也使用ng-table（@ 4.0.0）在成功提交服务器后进行本地/客户端插入/删除，并遇到类似的更新ng-table问题。 @ Bradley的上述答案不能直接起作用。所以我追逐了源代码，发现reload（）调用了getData（）。在我的案例中向目标行集（ctrl.tbContents.rows）插入一行后，我必须在tbParams定义中添加以下行以使ctrl.tbParams.reload()工作：

getData: function() {
  return ngTableDefaultGetData(ctrl.tbContents.rows, ctrl.tbParams);
}

注意注入ngTableDefaultGetData。

将动态行添加到ngTable不显示

2 个答案: