Renderer2使用循环将事件绑定到动态创建的元素

Question

我正在使用Angular 4+，import { Component, ElementRef, Renderer2 } from '@angular/core'; 我已经成功生成了一系列元素：

    const parentList = this.renderer.createElement('ul');
    let children = '';
    for(let i=0; i<totalItem; i++) {
       children += '<li id="item'+i+'">'+item.name+'</li>';
    }
    parentList .innerHTML = children;

    this.renderer.appendChild(
       this.elRef.nativeElement.querySelector('.wrapper'), 
       parentList);

使用renderer.listen，如何将click事件绑定到所有创建的li throgh迭代？ 我的尝试：

for(let j=0; j<totalItem; j++) {
   let listener =
     this.renderer.listen(
        this.elRef.nativeElement.querySelector('#item'+j), 
        'click',
        (evt) => {
           this.myFunc(j);
        }
      );
}

.....

myFunc(id) {
   alert(id);
}

问题是每次点击的li都会在迭代完成后提醒j的最新值。 我希望它为每个id警告不同的li。 我认为我绑定事件的方式是错误的。请帮我。