How to make a Button Enabled in Angular if all Checkboxes are selected?

Question

Angular

Let's say there is a variable isEnabled = true; isShow = false;
and 4 checkboxes -> md-checkbox`a and one button which is ng-disabled="isEnabled" .

<md-checkbox>
SOME TEXT.....
</md-checkbox>

<md-checkbox ng-if="isShow">
SOME TEXT.....
</md-checkbox>

<md-checkbox>
SOME TEXT.....
</md-checkbox>

<md-checkbox>
SOME TEXT.....
</md-checkbox>

<button ng-disabled="isEnabled"> Delete </button>

Here is an example from CodePen
How to make it so that if all checkboxes are pressed then the Button will be Enabled ?
the problem is that sometimes some of these Checkboxes can be invisible, i.e. ng-If.
Maybe for example there are 2 checkboxes and not 4, how in this case is the button Enabled ?

Answer 1

checkboxes need to be linked to the data model via `ng-repeat`, the data model is an array, create a getter `isButtonDisabled = ()=>checkboxList.some(i=>!i.checked)` bind this getter to the button