Question

我无法找到允许我删除按钮上的onclick事件的方法（//这里这里这里）。我花了很多时间寻找这个问题的解决方案，但仍然没有找到它。我希望有人会帮助我，谢谢。

cart.component.ts

getCartProducts(event: Event, cart: ICart) {
        for (let product of cart.Products)
        {
            event.srcElement.parentElement.parentElement.insertAdjacentHTML("afterend", "<tr><td>" + product.Name + "</td><td>" + product.Price + "</td></tr>");
        }
        event.srcElement.textContent = "Скрыть продукты";
        event.srcElement.attributes.getNamedItem("title").value = "Скрыть продукты";      
                 
        /* this doesn't work!! */ event.srcElement.removeEventListener("click", function (e) { CartsComponent.prototype.getCartProducts(event, cart) }, false);         
        /* but this works!! */ event.srcElement.addEventListener("click", function (e) { CartsComponent.prototype.hideCartProducts(event) }, false);
    }
    
     hideCartProducts(event: Event) {
        event.srcElement.parentElement.parentElement.insertAdjacentHTML("afterend", "<span>qwqeq</span>");        
    }

cart.component.html

<table class='table table-striped' *ngIf='carts && carts.length'>
                    <thead>
                        <tr>
                            <th>Название</th>
                            <th>Описание</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr *ngFor="let cart of carts">
                            <td>{{cart.Name}}</td>
                            <td>{{cart.Description}}</td>
                            <td>
                                <button title="Показать продукты" class="btn btn-show" (click)="getCartProducts($event, cart)">Показать продукты</button> //here here here here here
                                <button title="Изменить" class="btn btn-primary" (click)="editCart(cart.Id)">Изменить</button>
                                <button title="Удалить" class="btn btn-danger" (click)="deleteCart(cart.Id)">Удалить</button>
                            </td>                          
                        </tr>
                    </tbody>
                </table>

伙计们，请更详细地写下你的答案，因为我不明白我应该做什么。

Answer 1

removeEventListener的第二个参数必须是您要删除的函数。它不能是一个相同的功能，它必须是相同的功能。

var foo = function (e) { ... };
x.addEventListener("event_name", foo);
x.removeEventListener("event_name", foo);

请注意foo变量的值不会改变，因此相同的函数将传递给添加和删除事件侦听器。

Answer 2

removeEventListener不适用于匿名函数。将其转换为外部函数。

https://www.w3schools.com/jsref/met_element_removeeventlistener.asp

'event.srcElement.removeEventListener'不起作用 - TypeScript

2 个答案: