当属性为 0 或以下时从数组中删除对象 - Angular

Question

我有一个允许用户编辑对象的控制器。这部分减少了对象的属性——我的模型的数量。当模型的数量达到0或以下时，理想情况下我想删除整个对象。

HTML

<div ng-app='basket'>
  <div ng-controller='BasketController as basket'>
    <div class='product' ng-repeat='product in cart.products'>{{ product.name }} Count: {{ product.quantity }} <a ng-click='product.quantity = product.quantity - 1'>Remove</a></div>
  </div>
</div>

JS

(function(){
  var app = angular.module('basket', []);
  var cart;

  app.controller('BasketController', function($scope, $http){

    $scope.getTimes=function(n){
      return new Array(n);
    };
    $scope.cart = {};
    $scope.cart.products = [{
      'name':'item 1',
      'quantity':3
    },{
      'name':'item 2',
      'quantity':3
    },{
      'name':'item 3',
      'quantity':3
    }];
  });

})();

现场演示

http://codepen.io/EightArmsHQ/pen/bNBmXm

因此，例如，在上面，如果您在第一个对象上一次又一次地单击 'remove'，当您到达 0 时，我想要一个如下所示的数组：

    $scope.cart.products = [{
      'name':'item 2',
      'quantity':3
    },{
      'name':'item 3',
      'quantity':3
    }];

Answer 1

您可以只编写一个删除方法来检查数量并将项目从列表中删除。

在你的控制器中：-

$scope.remove = function(product){
  var products = $scope.cart.products;
  product.quantity -= 1;

  if(!product.quantity){
    /*Splice the object from the array based on the index*/
    products.splice(products.indexOf(product), 1);
  }
}

点击后只需将其命名为：

<a ng-click='remove(product)'>Remove</a>

Demo

Answer 2

将您的 link 更改为：

<a ng-click='remove(product)'>Remove</a>

并在控制器中添加以下方法：

$scope.remove = remove;

function remove(product) {
    $scope.cart.products.splice($scope.cart.products.indexOf(product), 1);
}

当属性为 0 或以下时从数组中删除对象 - Angular

Remove object from array when attribute 0 or below - Angular

javascript

angularjs

angularjs-ng-repeat

HTML

JS

现场演示