how should i deselect the chekbox that is already selected in html page using angularjs?

I have checkboxes in my html as follows,

<div ng-repeat="fruit in fruits">
 <input type="checkbox" name=" ng-model="" 
  ng-checked="isChecked(fruit)" ng-required="true" ">
</div>
<input type="hidden" ng-model="selectedFruits"> 

And I have angular js code as follows,

$scope.fruits=[{name:"Mango", value:false},{name:"Apple", value:false},{name:"Banana", value:false},];

$scope.isChecked = function(fruit){
var array=["Apple","Banana"];
for(var I=0; I <array.length; I++)
{
if(fruit.name == array[I])
{
fruit.value=true;
}
}

var selectFruit ='';
$scope.fruits.forEach(function(fruit){

if(fruit.value){
   if(selectFruit){
   selectFruit += '-';
}
selectFruit += fruit.name;
}
})
$scope.selectedFruits = selectFruit;
}

And that hidden field is for appending the selected checkboxes name in "selectedFruits ". [Ex. Mango-Apple]

From above code I'm getting by default selected checkboxes in html page as Apple and Banana that is in an array.

My question is when I'm trying to deselect that checkboxes (Apple/banana), it does not gets deselected . It always shows selected only. How should I deselect that checkboxes? Can someone please help me?