how to give maximum selected element in angular js?

can we give maximum selected element limit in angular ?Actually I have one multiple selected element in which user can select multiple thing .But I need to restrict user In other other user only select 3 items from them .I will tell my problem again I have on button .On click of button I show pop up in which user select multiple element .I need user only select maximum 3 .if he try to select 4 element it gives error that you can't select more than three can we do in angular this ?

here is my code http://codepen.io/anon/pen/jPypNb.

angular.module('ionicApp', ['ionic'])
.controller('MyController', function($scope, $ionicPopover) {
  $scope.data =[
    {"name":"A", value:false},
    {"name":"B", value:false},
    {"name":"C", value:false},
    {"name":"D", value:false},
    {"name":"E", value:false}
  ]
  $ionicPopover.fromTemplateUrl('my-popover.html', {
    scope: $scope
  }).then(function(popover) {
    $scope.popover = popover;
  });


  $scope.openPopover = function($event) {
    $scope.popover.show($event);
  };

   $scope.closePopover = function() {
    $scope.popover.hide();
  };
}
)

Add a control on a Max value on button click

See updated code here http://codepen.io/anon/pen/jPypNb?editors=001

The process is here :

$scope.maxCheck = function($index){
    $scope.countMax = 0;
    for(i=0;i<$scope.data.length;i++){
      if($scope.data[i].value == true)
        $scope.countMax++;
    }
    console.log("CALC",$scope.countMax,$scope.MAX)
    if($scope.countMax > $scope.MAX){
      $scope.data[$index].value = false;
      alert("limit reached");
    }