未捕获（承诺）TypeError：这是未定义的

Question

When I call deleteCategory in View Class it gives me an error. The error in calling del(event.target.id) inside deleteCategory. It worked when I called it this way directly from view Class

       deleteCategory(service){
        this.tbody.addEventListener('click',async  event => {
            const clicked=event.target.tagName.toLowerCase();
            if (clicked == 'a'){
               const a= await this.service.deleteCategory(service.deleteCategory(event.target.id);
            }
        })
       }

---

Is there is a way to call the deleteCategory in Controller Class using the event handler inside View Class??

---

class View{

    constructor(){
        this.e=document.createElement.bind(document);
        this.root=document.getElementById('root');
        this.tbody=document.querySelector('[table-items]');
    }
  
    categorylist(lists){ 
        
        lists.forEach((list) => {
        const tr=createTableRow(this.tbody,"");
        const td=createTableData(tr,list.name,"pl-4");
        const tdEditDelete=createTableData(tr,"","text-right pr-4");
        const editButton=createButton(tdEditDelete,'submit','Edit',list.id,'btn btn-primary mr-2');
        const deleteButton=createA(tdEditDelete,'Delete',list.id,'btn btn-danger');
        this.deleteButton=deleteButton;
        })  
    }



       deleteCategory(del){
        this.tbody.addEventListener('click',  event => {
            const clicked=event.target.tagName.toLowerCase();
            if (clicked == 'a'){     
                del(event.target.id);     
            }
        })
    }
}

class Controller{

    constructor(service,view){
        this.view=view;
        this.service=service;
        this.displayCategoryList();
        this.view.deleteCategory(this.deleteCategory);
        //this.deleteCategory();
    }

    async displayCategoryList() {
        const lists=await this.service.getLists();
        this.lists=lists;
        this.view.categorylist(lists);
    }
    
     async deleteCategory(id){
        //console.log(id);
        
        const a= await this.service.deleteCategory(id);
    }

}

Answer 1

I found this solution and worked for me.

Instead of calling deleteCategory constructor in Controller Class

this.view.deleteCategory(this.deleteCategory);

Replaced it with this

this.view.deleteCategory((async(id)=> {
     const a= await this.service.deleteCategory(id);
     }));