【问题标题】:Adding dynamic row to ngTable not displaying向ngTable添加动态行不显示
【发布时间】:2023-03-24 04:15:01
【问题描述】:

我使用分组功能创建了一个带有 ngTable 的应用程序,该应用程序运行良好,但问题是当我向表中添加动态数据(行)时,它不会动态反映,除非我们单击表标题时用于排序或当我们点击分页时

我已经在 plunker 中重新创建了问题,在那里你可以找到一个按钮,当单击时添加了一个动态行,但未在表格中反映

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'});
}

谁能告诉我一些解决方法?

【问题讨论】:

    标签: javascript angularjs dynamic html-table ngtable


    【解决方案1】:

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

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

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

    【讨论】:

      【解决方案2】:

      我也在使用 ng-table(@4.0.0) 在服务器成功提交后进行本地/客户端插入/删除,并遇到更新 ng-table 的类似问题。 @Bradley 上面的回答不能直接起作用。于是追了下源码,发现reload()调用了getData()。将一行插入目标行集(在我的情况下为ctrl.tbContents.rows)后,我必须在 mytbParams 定义中添加以下行以使ctrl.tbParams.reload() 工作:

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

      注意注入ngTableDefaultGetData

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2016-11-08
        • 2012-11-20
        • 1970-01-01
        • 1970-01-01
        • 2020-04-05
        • 1970-01-01
        相关资源
        最近更新 更多