javascript - 从角度 $scope 承诺中删除一行

Question

Angular 足够聪明，可以直接绑定 Promise。我有一个绑定到从服务返回的承诺的 ng-grid 实例。稍后我想删除该网格中的一条记录，但由于我没有可以直接操作的数组，我不确定该怎么做。

例如，以下将引发错误“TypeError: Object # has no method 'splice'”，因为“gridData”实际上不是一个数组。

//Bind promise directly to scope (get returns a promise not an array)
$scope.gridData = myService.get();

//Later I remove a row based on user a user clicking a button on the grid row.
var function = removeRow(rowIdx)
    { 
       $scope.gridData.splice(rowIdx, 1);
    };

最终，我如何将范围值设置为 Promise 并仍然直接操作数据？

Answer 1

解决后，您无法更改 Promise 的值。

您可以做的是将实际值设置为范围属性并对其进行修改。事实上，你应该尽快摆脱承诺。

//Bind promise directly to scope (get returns a promise not an array)
myService.get().then(function (resolved) {
    $scope.gridData = resolved;
});

//Later I remove a row based on user a user clicking a button on the grid row.
function removeRow(rowIdx) { 
   $scope.gridData.splice(rowIdx, 1);
};

Answer 2

底层数据数组暴露在$scope.gridOptions.ngGrid.data（假设您的 ngGrid 绑定到gridOptions） - 您可以直接操作它，尽管我没有尝试过

Answer 3

有多种方法可以做到这一点。其中之一是编写对数组进行切片的过滤器：

.filter("slice", function () {
    return function (array, begin, end) {
        if (!angular.isArray(array)) return;
        return array.slice(begin, end);
    };
});

并将其用于 ng-repeat 中的集合：

<li ng-repeat="item in (data|slice:1)">{{item}}</li>

工作示例。

此外，由于您的数据是从 promise 返回的，因此只需将then添加到控制器即可：

$scope.gridData = myService.get().then(function (data) {
    return data.slice(1)
});

工作示例。