7

我在我的 AngularJS 应用程序中使用 Restangular。我有一个表，每个项目都有一个删除链接。我想删除该项目并自动删除该行。但事实上它只会从数据库中删除。我如何重构事物以使其 DOM 自动更新？

// The controller
angular.module('myApp').controller('ManageCtrl', function($scope, Restangular) {

  $scope.delete = function(e) {
     Restangular.one('product', e).remove();
  };

  Restangular.all('products').getList({}).then(function(data) {
    $scope.products = data.products;
    $scope.noOfPages = data.pages;
  });
});


 // The view
 <li ng-repeat="product in products">
   <a href="#" ng-click="delete(sheet._id)"></a>
  </li>

我也很想找到一个这样的例子——即使是 Angular 资源。所有管理/数据表演示似乎都使用静态数据。

4

2 回答 2

19

根据 Restangular https://github.com/mgonto/restangular#restangular-methods他们提到你应该使用原始项目并使用它运行一个动作，所以在你的html代码中你应该：

 <li ng-repeat="product in products">
   <a href="#" ng-click="delete(product)"></a>
</li>

然后在你的控制器中：

 $scope.delete = function( product) {
    product.remove().then(function() {
      // edited: a better solution, suggested by Restangular themselves
      // since previously _.without() could leave you with an empty non-restangular array
      // see https://github.com/mgonto/restangular#removing-an-element-from-a-collection-keeping-the-collection-restangularized

      var index = $scope.products.indexOf(product);
      if (index > -1) $scope.products.splice(index, 1);
   });
 };

请注意，他们使用underscore.js，没有它会从数组中删除元素。我猜如果他们在自述页面中发布该示例，这意味着该.remove()函数不会从集合中删除原始项目。这是有道理的，因为并非您删除的每个项目都希望从集合本身中删除。

另外，如果DELETE $HTTP请求失败怎么办？然后您不想删除该项目，并且您必须确保在您的代码中处理该问题。

于 2013-08-30T11:11:19.400 回答
2

就我而言，上述方法不太奏效。我必须执行以下操作：

$scope.changes = Restangular.all('changes').getList().$object;

    $scope.destroy = function(change) {
        Restangular.one("changes", change._id).remove().then(function() {
            var index = $scope.changes.indexOf(change);
            if (index > -1) $scope.changes.splice(index, 1);
        });
    };
于 2015-03-18T17:51:22.043 回答