2016-08-06 14 views
2

Ich möchte die ausgewählten Kontrollkästchen in meiner Schleife, für das Kontrollkästchen Ich habe das Betrag Feld onclick abrufen.angularjs nur ausgewählt Kontrollkästchen

Hier ist mein HTML-Skript:

<div ng-repeat="$item in items"> 
    Amount :<input ng-model="$item.daily_data.payment_amount"> 
    Check : <input type=checkbox ng-model="checkAmount[$item.daily_data.id]" ng-value="$item.id" > 
</div> 

<input type="button" ng-click="checkNow()" /> 

Das folgende Skript alle Kontrollkästchen zeigt. Ich möchte das einzige ausgewählte. Script

JS:

$scope.checkAmount = {}; 
$scope.checkNow(){ 
console.log($scope.checkAmount); 
} 
+0

Sind Sie in 'ngRepeat'? – developer033

+0

Ja. Inside ngRepeat –

+0

Aktualisiert die Frage, hoffe, Sie können die Änderung sehen. irgendeine Lösungsmöglichkeit.? –

Antwort

3

allererst functions mit $scope verwenden, sollten Sie etwas tun:

$scope.checkNow = function() { 
    ... 
} 

oder

$scope.checkNow = checkNow; 

function checkNow() { 
    ... 
} 

Über Ihr Problem:

Sie konnten die checkboxes auf eine Eigenschaft (so etwas wie checked) binden, so können Sie die Elemente, die checked leicht in Ihrer controller sind.

Dann berechnen die Gesamt aller Menge geprüft, ich schlage vor, Sie Array.prototype.filter() + Array.prototype.reduce() zu verwenden.

Hier ist eine Demo basierend auf Ihren originalcode:

(function() { 
 
    angular 
 
    .module("app", []) 
 
    .controller('MainCtrl', MainCtrl); 
 

 
    MainCtrl.$inject = ['$scope']; 
 

 
    function MainCtrl($scope) { 
 
    $scope.checkNow = checkNow; 
 
    $scope.checkAmount = {}; 
 
    $scope.items = [ 
 
     { 
 
     "id": 1 
 
     }, 
 
     { 
 
     "id": 2 
 
     }, 
 
     { 
 
     "id": 3 
 
     } 
 
    ]; 
 

 
    function checkNow() { 
 
     $scope.total = $scope.items.filter(function(value) { 
 
     return value.checked; 
 
     }).reduce(function(a, b) { 
 
     return a + b.amount; 
 
     }, 0); 
 
    } 
 
    } 
 
})();
<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script> 
 
</head> 
 

 
<body ng-controller="MainCtrl"> 
 
    <div ng-repeat="$item in items"> 
 
    <label> 
 
     Amount: <input type="number" ng-model="$item.amount"> 
 
    </label> 
 
    <label> 
 
     Check: <input type=checkbox ng-model="$item.checked"> 
 
    </label> 
 
    </div> 
 

 
    <button type="button" ng-click="checkNow()">Check now</button> 
 
    <hr> 
 
    <label for="total">Total</label> 
 
    <input type="number" id="total" disabled ng-model="total"> 
 
</body> 
 

 
</html>

+0

Wenn Mein Betrag und ID auf dieser Ebene die '$ item.daily_data.payment_amount'. –

+0

habe ich nicht verstanden .. kannst du bitte ausarbeiten? – developer033

+0

Sicher, ich werde das tun. Gib mir bitte eine Minute. –