如何纠正阵列中的这种冗余?

时间:2016-04-25 17:20:04

标签: javascript arrays angularjs ionic-framework ionic2

我在离子中构建一个应用程序,我需要将项目传递到另一个数组中,但是当我再次传递相同的项目时,它被认为是同一个项目 - 实际上 - 但我需要这样做发生。我需要将它们视为不同或至少被认为是不同的。数组的每个项目(是一个对象)都有一个变量"qntt"(quantity),当这个错误发生时,将相同的项放在数组中,加上这个变量中的一个。 OBS:我在html中使用ng-repeat="item in items track by $index"

<ion-view title="Order">
<ion-content overflow-scroll="true" padding="true" style="background: url(img/background1.jpg) no-repeat center;" class="has-header" ng-controller="pedidoCtrl">
    <button class="button button-dark button-small button-block" ng-click="showDelete = !showDelete">Remover</button>
    <ion-list show-delete="showDelete">
        <ion-item class="item-thumbnail-left item-remove-animate" ng-repeat="item in items track by $index">
            <ion-delete-button class="ion-minus-circled" ng-click="deleteItem(item)"></ion-delete-button>
                <img src="{{item.img}}">
                <h2>{{item.nome}}</h2>
                <div class="row">
                    <div class="col col-60">
                        <h2>R{{item.subtotal | currency}}</h2>
                    </div>
                    <div class="col col-15">
                        <button class="button button-clear button-assertive button-small icon ion-minus" ng-click="subQtt(item)"></button>
                    </div>
                    <div class="col col-10">
                        <h2>{{item.qtt}}</h2>
                    </div>
                    <div class="col col-15">
                        <button class="button button-icon-right button-clear button-assertive button-small icon ion-plus" ng-click="addQtt(item)"></button>
                    </div>
                </div>
        </ion-item>
    </ion-list>
    <button style="text-align:right;" class="button button-assertive  button-block icon-left ion-cash">R{{total | currency}}</button>
    <div style="margin-right:-20px;">
        <button style="left:-10px;" class="button button-dark button-large button-full icon ion-android-cart">Order</button>
    </div>
</ion-content>

.controller('orderCtrl', function($scope, productService) { 
$scope.items = null;
$scope.items = productService.getProducts();

$scope.deleteItem = function(item){
    $scope.items.splice($scope.items.indexOf(item), 1);
};

$scope.$watchCollection('items', function(array) {
     if (array) {
            $scope.total = array.reduce(function(total,item) {
                    return total + item.subtotal;
                },0);
      } 
      $scope.addQtt = function(item){
        item.qtt = item.qtt + 1;
        item.subtotal = item.price * item.qtt;
        $scope.total = array.reduce(function(total,item) {
                    return total + item.subtotal;
                },0);
       };
        $scope.subQtt = function(item){
            if(item.qtt > 1)
            {
                item.qtt--;
                item.subtotal = item.price * item.qtt;
            }
            else
            {
                $scope.items.splice($scope.items.indexOf(item), 1);
            }
            $scope.total = array.reduce(function(total,item) {
                    return total + item.subtotal;
                },0);
    }; 
 });

})

.service('productService', [function(){
var productList = [];

var addProduct = function(product) {
    productList.push(product);
};

var getProducts = function(){
    return productsList;
};
return {
    addProduct: addProduct,
    getProducts: getProducts,
};
}]);

1 个答案:

答案 0 :(得分:0)

那是因为您没有在控制器中调用服务方法addProduto()。尝试在produtoService.addProduto()方法中调用$scope.addQnt(),如下所示,它应该有效:

$scope.addQnt = function(item){
  item.qntd = item.qntd + 1;
  item.subtotal = item.preco * item.qntd;
  $scope.total = array.reduce(function(total,item) {
    return total + item.subtotal;
  },0);
  
  // Add this line to retain your addition in service
  produtoService.addProduto(item);

  // Get updated list of products
  $scope.items = productoService.getProdutos();
  // Alternatively use '$scope.items.push(item)'
};

此外,您需要通过拨打$scope.items来重新启动productoService.getProdutos(),但您可以通过推送$scope.items.push(item)直接执行此操作