How do you enable / disable a button based on list of dynamically created checkboxes?

I've got a html table that is dynamically populated with data. If the user is in a certain role a checkbox will be visible to them on all rows in the table. If ANY of those checkboxes are ticked then a button on the bottom should become enabled.

Here's the checkbox:

<tr>
    <td *ngIf="role.IsValid">
        <input #myCheckbox type="checkbox" [(ngModel)] = "items.itemId" id="checkbox" [attr.checked]="items.itemId" (click)="updateItemCount(myCheckbox.checked)" />
    </td>
<tr>

Under the table I've got a button that should be disabled when no checkboxes have been selected and become enabled as soon as at least 1 checkbox has been clicked.

<button type="button" (click)="openModal()" [attr.disabled]="itemsSelectedCount === 0">Submit</button>

The typescript for the updateItemCount() method is below and simply increases or decreases the itemsSelectedCount variable by 1:

updateItemCount(checked: boolean) {
  if (checked) {
    ++this.itemsSelectedCount;
  }
  else {
    --this.itemsSelectedCount;
  }
}

I've debugged and can see the correct true or false value entering the updateItemCount method and the itemsSelectedCount variable changing, but the button stays disabled. How can I conditionally enable this once the itemsSelectedCount goes above 0?