AngularJS复选框在取消选中时删除vlue

Question

所以我们有一个购物门户项目，当我们选中复选框时它会加上购物车中的值，问题是当我们取消选中复选框时它还在添加一个项目，我们再次检查它会添加又是一个价值。

     <input type="checkbox" id="{{p.productName}}" ng-checked="defaultCheckState"  ng-click="serviceAddOn(p);" />

我也试过这个

     <input type="checkbox" id="{{p.productName}}" ng-checked="defaultCheckState" ng-true-value="serviceAddOn(p);" ng-false-value="Clear"/>

角度代码

     $scope.IsSavingAddOn = false;
    $scope.serviceAddOn = function (product) {
    $scope.IsSavingAddOn = true;
    $scope.total = $scope.qty * product.priceValue;
    //AddToCartService.AddToCart(product.productId, 'Service', $scope.qty, product.priceValue, $scope.total, true);
    $http.post("/Home/AddCart?productid=" + product.productId + "&subs=Service&qty=" + $scope.qty + "&unitprice=" + product.priceValue + "&amount=" + $scope.total)
        .then(function (response) {
        }).finally(function (response) {
            $scope.$emit('CountCartEvent');
            $scope.IsSavingAddOn = false;
        });
};

Answer 1

使用ng更改并使用if条件检查是否选中复选框

<input type="checkbox" id="{{p.productName}}" ng-checked="defaultCheckState"  ng-change="serviceAddOn(p);" />

$scope.defaultCheckState = false;

$scope.serviceAddOn = function (product) {
    if(defaultCheckState){
        $scope.IsSavingAddOn = true;
        $scope.total = $scope.qty * product.priceValue;
        //AddToCartService.AddToCart(product.productId, 'Service', $scope.qty, product.priceValue, $scope.total, true);

        $http.post("/Home/AddCart?productid=" + product.productId + "&subs=Service&qty=" + $scope.qty + "&unitprice=" + product.priceValue + "&amount=" + $scope.total)
        .then(function (response) {
        }).finally(function (response) {
            $scope.$emit('CountCartEvent');
            $scope.IsSavingAddOn = false;
        });
    }
};