假设我有一个两个div,左边div包含所有带复选框的项目,右边一个是空的,但是点击左边div的每个项目的加号按钮我有一个点击处理程序从左div中删除所选项目,并且更改该元素的一些属性并添加右侧div,现在与其他属性一起我应该将右侧div的添加项目的click事件更改为另一个处理程序:
enter image description here

单击具有加号图标的左侧项目事件被映射到名为 (click)='addItem($event)' 的函数,在此函数中我从左侧div中删除目标元素,并更改某些属性,如 checked=true, and fa-plus to fa-minus ,但我需要将其单击处理程序更改为另一个函数 removeItem($event) . 我试过的:

addItem(itemId) {
    const element = <HTMLInputElement> document.getElementById(itemId);
    element.checked = true;
    const itemsWrapper = <HTMLInputElement> 
    document.getElementById('item4select');
    const selectedItemWrapper = <HTMLInputElement> document.getElementById('selectedItems');
    const selectedItem = itemsWrapper.querySelector('li[data="'+itemId+'"]');

    itemsWrapper.removeChild(selectedItem);

    selectedItem.setAttribute('data', 'sel_'+itemId)
    selectedItem.querySelector('input[type="checkbox"]').setAttribute('id', 'sel_'+itemId);
    // Bellow two line are for changing click event.
    //selectedItem.querySelector('input[type="checkbox"]').click = 'removeMe($event)';

  //selectedItem.querySelector('input[type="checkbox"]').setAttribute('click', 'removeMe($event)');

selectedItem.querySelector('span[refLabel="addItemBtn"]').classList.remove('fa-plus');
  selectedItem.querySelector('span[refLabel="addItemBtn"]').classList.add('fa-minus');
selectedItemWrapper.appendChild(selectedItem);
this.checkAllOfSelectedItemsChecked = true;
this.checkAllOfSelectedItemsClass = 'fa-check-square';

}