Angular 2 select or deselect checkboxes on condition

Please, note that I want to avoid jquery and use only Angular 2. Being that said, here is the PLUNK

I have some custom checkboxes, initially more than one can be selected. I am storing the selected items in an array like this:

    eventChkArr: any = [];
    updateChecked(value: any, event: any) {
        if (event.target.checked) {
          this.eventChkArr.push(value);
        }
        else if (!event.target.checked) {
          let index = this.eventChkArr.indexOf(value);
          this.eventChkArr.splice(index, 1);
        }
      }

When user selects more than one check box, a modal pops up (this modal is not popping up in the plunk for some reason) and ask if they want to select multiple checkboxes. Now, what I am trying to do is if user clicks on no button then only the last clicked button before modal popup will remain checked and on user's further clicking only one checkbox will be selected at a time. If they click on "yes" then multiple checkboxes can be selected. But, how do I achieve that, any help? TIA.