AngularJS: SetValidity within an ng-repeat - angularjs

Question

I want to check that an input value is valid, (i.e. if someone is spending at least 25 cents on a candy from a list of candies), and if not, tag that input as $invalid, so the form doesn't get submitted.
<form novalidate name="candyForm">
<div ng-repeat="candy in candies">
<input name="candyCost" type="text" ng-model="candy.cost" required>
<div class="error" ng-show='checkEnoughMoney()'>You only have 1 dollar to spend</div>
<div class="error" id="candyError{{$index}}">You must spend at least 25c per candy</div>
</div>
</form>
The checkEnoughMoney() is:
$scope.checkEnoughMoney = function() {
var total = 0;
for(var i = 0; i < $scope.candies.length; i++) {
var amount = parseFloat($scope.sweets[i].cost) || 0;
total = total + amount;
if((parseFloat(amount) >= 25) && (parseFloat(amount) <= 100)) {
$("#candyError" + i).hide();
}
else {
$("#candyError" + i).show();
}
}
if(total > 100) {
$scope.candyForm.candyCost.$setValidity('candyForm.candyCost',false);
return true;
}
else {
$scope.candyForm.candyCost.$setValidity('candyForm.candyCost',true);
return false;
}
};
Setting the $scope.candyForm.candyCost to true or false works here as it affects all the instances if candies, which is great, as it needs to. But how do I make the single instance invalid if the person has entered less than 25 cents or more than 100 cents?
As you can see, I have cheated to make the 25>=cost>=100 messages show when they should, but the form is still submitting, as the input is not being set to invalid. If I try $scope.candies[index].setValidity("cost", false), it throws an error, as the parent scope can't access the scope inside the ng-repeat. Is there any way to get around this?

Answer 1

Here's an example of handling forms in Angular that should take care of your problem.
http://docs.angularjs.org/cookbook/advancedform
I prefer to setup a controller fn to handle requests and pass those through a service.