html - 如何在 Button 单击时获取当前 *ngFor 值？

Question

我一直在尝试获取用户点击头像的数据项的data.login。 HTML 代码如下。 我在网络上尝试了所有可能的方法，但无法使其正常工作。 如何获取当前data.login到对应的.TS文件。

代码:

<ul *ngFor="let data of uarr" class="list-unstyled" >
    <li>
          <div class="col-sm-6 col-md-3">
            <div class="thumbnail">
              <a routerLink="/" >
                <img class="github-avatar" src="{{data.avatar_url}}" >
              </a>
              <div class="caption">
                <h3 class="text-center">{{ data.login }}</h3>
              </div>

            </div>
          </div>
    </li>

谢谢。

Answer 1

使用点击事件

<ul *ngFor="let data of uarr" class="list-unstyled"  >
    <li>
          <div class="col-sm-6 col-md-3">
            <div class="thumbnail" (click)="onClick(data.login)">
              <a routerLink="/" >
                <img class="github-avatar" src="{{data.avatar_url}}" >
              </a>
              <div class="caption">
                <h3 class="text-center">{{ data.login }}</h3>
              </div>

            </div>
          </div>
    </li>

TS

onClick(login){
console.log(login);
}