How to disabled the button, when checkbox are not selected

Question

I am trying disabled the button, but the Typescript code doesn't work! When I selected the first and two checkbox, but I deselected the first checkbox, the button automatically is disabled. Example Example2

<div class="satisfaction-survey-answers">
        <h2>
            Cuéntanos qué te agradó del proceso que acabas de realizar
        </h2>
        <div class="form-check">
            <ul class="inner-panel">
                <li>
                    <label class="inner-panel__checkbox">
                        Item número 1
                        <input id="toggle" type="checkbox" (change)="changeEvent($event)">
                        <span class="custom-check"></span>
                    </label>
                </li>
                <li>
                    <label class="inner-panel__checkbox">
                        Item número 2
                        <input type="checkbox" (change)="changeEvent($event)">
                        <span class="custom-check"></span>
                    </label>
                </li>
                <li>
                    <label class="inner-panel__checkbox">
                        Item número 3
                        <input type="checkbox" (change)="changeEvent($event)">
                        <span class="custom-check"></span>
                    </label>
                </li>
            </ul>
        </div>
    </div>
    <div>
        <app-button id="sendNewSms" [classButton]="'send-satisfaction-survey-button'" [typeButton]="'button'"
            [labelButton]="'Enviar'" [isDisabled]="toggleBool">
        </app-button>
    </div>

toggleBool: boolean = true;
  changeEvent(event) {
    if (event.target.checked) {
      this.toggleBool = false;
    }
    else {
      this.toggleBool = true;
    }
  }

Answer 1

I have written code that has disabled and changed parts of the website based on a checkbox, but not really. I found it pretty confusing at first when I did it, but I understood later. (of course put inside an html tag)

<button id="abutton" onclick="// some code">A Button</button>
<input onclick="disableButton()" type="checkbox" id="checkbox">
<script>
function disableButton() {
    if (document.getElementById('checkbox').checked == false) {
       document.getElementById('abutton').disabled = true
    } else if (document.getElementById('checkbox').checked == true) {
       document.getElementById('abutton').disabled = false
    }
}
</script>