JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div ng-app="test" ng-controller="myController">
  <button ng-click="save()" ng-disabled="!hasSelectedAnItem" class="btn btn-sm btn-block btn-primary">
    Save
  </button>
  <ul class="categories-list">
      <li ng-repeat="cat in items">
          <label><input type="checkbox" id="cat-{{cat.OptionValue}}" ng-model="cat.IsSelected" ng-change="canBeSaved()"/> {{cat.OptionName}}</label>
      </li>
  </ul>
</div>

JavaScript

angular.module('test', [])

.controller('myController', ['$scope', function($scope) {
	$scope.hasSelectedAnItem = false;

   $scope.items = [
   		{OptionValue: 123, OptionName: "Adam", IsSelected: true},
      {OptionValue: 234, OptionName: "Paul", IsSelected: false},
			{OptionValue: 345, OptionName: "Jason", IsSelected: true},			
      {OptionValue: 464, OptionName: "Joe", IsSelected: false}
   ];
   
   $scope.canBeSaved = function() {
   		
      var found = false;
   		$scope.items.forEach(function(item) {
      	if (item.IsSelected) {
        	alert("Here");
        	found = true; 
        }
      });
      
      $scope.hasSelectedAnItem = found;
   }
   
   $scope.save = function() {
   		alert($scope.cat.IsSelected);
   }
   
   $scope.canBeSaved();
}]);