Запуск метода класса в обработчике событий

Question

class Controller {

    constructor(names){
        this.names = names;
    }

    sayhello(name){
        console.log("Hello " + name);
    }

    makeLink() {
        this.names.forEach(function(name){
            var link = document.createElement('li');
            link.innerHTML = name;
            var container = document.getElementById('container');
            container.appendChild(link);
            link.addEventListener('click', (event) => {
                sayhello(event.target.innerText);
            });
        });
    }
}

Вот пример того, что я пытаюсь сделать в моем реальном коде. Я хочу вызвать метод класса 'sayhello' при нажатии кнопки li, чтобы он выводил имя, соответствующее значению li. Тем не менее, это не похоже на работу. Я пытался найти решение, но мне все еще не повезло найти его. Кто-нибудь знает, как я мог бы сделать эту работу?

Answer 1

sayhello не существует в области действия makeLink s, но в его контексте (он же this), поэтому вы должны позаботиться о том, чтобы не потерять контекст через этот forEach function, тогда вы можете легко получить доступ это:

makeLink() {
    this.names.forEach((name) => { // <----
        var link = document.createElement('li');
        link.innerHTML = name;
        var container = document.getElementById('container');
        container.appendChild(link);
        link.addEventListener('click', (event) => {
            this.sayhello(event.target.innerText); // <----
        });
    });
}