Angular dynamic checkboxes with iteration

I have a loop delivering a collection of checkboxes which respond as expected by default. I now need to cap the maximum that can be checked at 8.

I'm trying to add ng-model (and tried ng-if) to the class like below but the behavior is incorrect.

HTML

<div class="col-xs-12 col-sm-4 " ng-hide="vm.resultCount === 0" ng-repeat="np in vm.corporations">
  <div class="Checkbox">
    <input type="checkbox" ng-click="vm.updateCart(np)"/>
      <div class="Checkbox-visible" model="!vm.overEightCorporations">

CSS

> input:checked + .Checkbox-visible {
    background: #000 url('../images/CheckMark_White.png') center/20px 20px no-repeat;
}

> input:focus + .Checkbox-visible {
}

JS

vm.overEightCorporations = function () {

        if ($rootScope.cart.length > 7){
            return true;
            toastr.error('You can only set 8 corporations at a time.');
        }
        return false;
        }
    };