首页 > 解决方案 > 创建 addEventListener 时在函数中传递 *ngFor 值

问题描述

我正在下面创建事件侦听器,但我不知道如何将 ngFor 值设置为 this.pop 作为参数。

ngAfterViewInit() {
this.elementRef.nativeElement.querySelector('.spells img')
                              .addEventListener('mouseover', this.pop.bind(this, event));
}

这是 HTML 代码

    <ul class= "list-unstyled row">
      <li *ngFor = "let z of data(m[m.length-1]) | slice: 0 : 10; index as j" class = "list-item col-6">
        <img class = "champ" src = {{z[0]}}/>
        <div class = "spells">
          <img src = {{z[1].spellurl}}/>
          <img src = {{z[2].spellurl}}/>
          <div class = "desc"></div>
        </div>
      </li>
    </ul>

因此,当我将鼠标悬停在 div.spell 中的这些图像上时,我想调用函数 pop

    pop(event){
    //let ds = document.getElementsByClassName(".spells .desc");
    let pos = event.target.getBoundingClientRect();
    let newpos = "translate(" + pos.right + "px, " + pos.bottom + "px)";
    console.log(newpos);
    let selected = this.elementRef.nativeElement.querySelector('.spells .desc');
    selected.style.display = "block";
    selected.innerHTML = desc;
    selected.style.transform = newpos;
}

该函数将决定 div.desc 的位置及其内容。我可以使用“事件”来计算位置,但问题是selected.innerHTML“z”中*ngFor = "let z of data(m[m.length-1])有描述,我想将其用作 div 的内容,但我不知道如何使用该值作为 addEventListener 中函数的参数.

有什么建议吗??谢谢你

标签: javascriptangular

解决方案


推荐阅读