javascript - AngularJS 的 ng-table 重新加载不起作用

Question

我一直在谷歌搜索，但没有一个解决方案对我有用。我有一个 AngularJS 页面，它只有一小组数据，没有分页或任何内容，我只想能够删除一个条目并更新表。但是我对 $scope.tableParams.reload() 的调用没有执行任何操作。这是我的 Controller :

app.controller('viewVersion', ['$scope', '$filter', '$RestService', 'NgTableParams', '$cookies', '$routeParams', '$q', 'Flash', '$location', function($scope, $RestService, NgTableParams, $cookies, $routeParams, $q, Flash, $location) {
    $scope.version = {id:null, version:null, comment:null, states:[]};
    $scope.permissions=$cookies.get('permissions');
    var promise = $RestService.StateList(); //Get the list of states to use to map state ids to their names (BOI, REQ, etc).
    promise.success(function(data) {
      $scope.stateList = data;
    });

    promise.then(function(){
        var inprom = $RestService.GetVer($routeParams.verid); //Get the version from the API given the version id.
        inprom.success(function(data){
          data.forEach(function(ver) {
            $scope.version['id'] = ver.id;
            $scope.version['version'] =ver.version;
            $scope.version['platform'] =ver.platform;
            $scope.version['comment'] = ver.comment;
            if (ver.state!=null) {
              var state_info = _.where($scope.stateList, {state_id:ver.state})[0];
              $scope.version.states.push({state:state_info.state_name, state_id:ver.state, launch:ver.launch});
            }
          });
        })
        inprom.error(function(errorData) {
          $cookies.set('flash_message', "Error getting version with ID "+$routeParams.verid);
        });
        inprom.then(function() {
          $scope.tableParams = new NgTableParams({
            sorting: { launch: "desc" }
          }, {
            counts:[],
            total: $scope.version.states.length,
            filterDelay: 0,
            dataset: angular.copy($scope.version.states)
          });
        });
    });

    $scope.delete = function(row) {
        _.remove($scope.tableParams.settings().dataset, function(item) {
          return row.state_id === item.state_id;
        });
        $scope.tableParams.total($scope.tableParams.settings().dataset.length);
        $scope.tableParams.reload();
    };
}]);

以及匹配的html:

<table ng-table="tableParams" class="table table-bordered table-hover table-condensed editable-table" ng-form="tableForm">
    <tr ng-repeat="state in version.states" ng-form="stateForm">
      <td title="'State'" sortable="'state'">{{state.state}}</td>
      <td title="'Launch Date'" sortable="'launch'" ng-switch="state.isEditing" ng-form="launch">
        <span ng-switch-default class="editable-text">{{state.launch | date:'medium':'UTC'}}</span>
        <div class="controls" ng-class="stateForm.$invalid ? 'has-error' : ''" ng-switch-when="true">
          <input type="text" name="name" ng-model="state.launch" class="editable-input form-control input-sm" required />
          <p ng-show="stateForm.$invalid && !stateForm.$pristine" class="help-block">Enter a valid date and time.</p>
        </div>
      </td>
      <td>
        <button class="btn btn-primary btn-sm" ng-show="permissions.indexOf('admin') > -1" ng-click="save(state, stateForm)" ng-if="state.isEditing" ng-disabled="stateForm.$pristine || stateForm.$invalid"><span class="glyphicon glyphicon-ok"></span></button>
        <button class="btn btn-default btn-sm" ng-show="permissions.indexOf('admin') > -1" ng-click="cancel(state, stateForm)" ng-if="state.isEditing"><span class="glyphicon glyphicon-remove"></span></button>
        <button class="btn btn-default btn-sm" ng-show="permissions.indexOf('admin') > -1" ng-click="state.isEditing = true" ng-if="!state.isEditing"><span class="glyphicon glyphicon-pencil"></span></button>
        <button class="btn btn-danger btn-sm" ng-show="permissions.indexOf('admin') > -1" ng-click="delete(state)" ng-if="!state.isEditing"><span class="glyphicon glyphicon-trash"></span></button>
      </td>
    </tr>
  </table>

任何帮助将不胜感激。谢谢!

Answer 1

您的行直接来自您的数据，
<tr ng-repeat="state in version.states">

...但是您的删除函数正在从 ng-table 的数据副本中删除行:

$scope.delete = function(row) {
    _.remove($scope.tableParams.settings().dataset, function(item) {
      return row.state_id === item.state_id;
    });
    $scope.tableParams.total($scope.tableParams.settings().dataset.length);
    $scope.tableParams.reload();
};

您想从 ng-table 的副本中提取行:
<tr ng-repeat="state in $data">

这是一个简化的演示:http://plnkr.co/edit/kuAdN3ToKDZtp338E6Hp?p=preview