dimanche 26 avril 2015

angular js checkbox and select dynamic binding to give total price

i have a working code that gives the sum of the total item in a json file after ticking one or all of the checkboxes

Here is my controller

$scope.items = [{name:item1,price:400},{name:1tem2,price:800},{name:item3,price:1000}];
$scope.selectedItems = [];
        $scope.value = function (isSelected, item) {
        if (isSelected == true) {
            $scope.selectedItems.push(item);
        } else {
           // console.log(item.name);
            angular.forEach($scope.selectedItems, function (itemRmv, $index) {
                if (itemRmv.itemid == item.itemid) {
                    $scope.selectedItems.splice($index, 1);
                }
            })
        }
        console.log($scope.selectedItems);
    }

the filter

.filter('getprice', function () {
    return function (value, property) {
        var total = 0;
        angular.forEach(value, function (val, index) {
            total = total + Number(val.price)
        });
        return total.toFixed(2);
    }
});

the html

<ul class="list" ng-repeat ="item in testFood">

  <li class="item item-checkbox">
     <label class="checkbox">
       <input type="checkbox" ng-model="item.isSelected" ng-change="value(item.isSelected,item)">
     </label>
     {{item.package_name}}  &nbsp; &nbsp; <p>N {{item.price}}</p>
  </li> X
 <label class="item item-input">
    <input type="number" value="0"  min="0" step="1">
  </label>
</ul>

Calling {{selectedItems | getprice}} give me the total price without the quality I want the quantity for each product to be calculated along side the total price

Any help will be appreciated thanks




Aucun commentaire:

Enregistrer un commentaire