How to make checkboxes 'checkable' only if another box is checked

So imagine I have 3 checkboxes, 1 'parent' checkboxes and 2 'child' checkboxes.

If the parent checkbox is checked, I want to be able to check either or both of the two child checkboxes.

If the parent checkbox is unchecked, I either of the two child checkboxes should not be checkable at all.

<div id="mycheckboxes">

        <label class="custom-control custom-checkbox" style="display: block">
          <input type="checkbox" class="custom-control-input" id="parentcheckbox" name="parentcheckbox"
                 [(ngModel)]="parentcheckbox1" (ngModelChange)="parentcheckbox1($event)">
          <span class="custom-control-indicator"></span>
          <span class="custom-control-description">
        </label>


        <label class="custom-control custom-checkbox" style="display: block">
          <input type="checkbox" class="custom-control-input" id="childcheckbox1" name="childcheckbox1"
                 [(ngModel)]="childcheckbox1" (ngModelChange)="childcheckbox1($event)">
          <span class="custom-control-indicator"></span>
          <span class="custom-control-description">
        </label>

        <label class="custom-control custom-checkbox" style="display: block">
          <input type="checkbox" class="custom-control-input" id="childcheckbox2" name="childcheckbox2"
                 [(ngModel)]="childcheckbox2" (ngModelChange)="childcheckbox2($event)">
          <span class="custom-control-indicator"></span>
          <span class="custom-control-description">
        </label>

</div>

currently everyone of of these checkboxes are checkable, to reiterate the above, I am trying to make it so if parentcheckbox is checked, the two children are selectable, and if parent is unchecked, the two children are uncheckable.