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

Question

我有一个 Controller ，可以让用户编辑对象。其中一部分会减少对象的属性——我的模型的数量。当模型的数量达到 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

例如，在上面，如果您在第一个对象上一次又一次单击“删除”，当您达到 0 时，我只想拥有一个如下所示的数组:

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

Answer 1

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

在你的 Controller 中:-

$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