首页 > 解决方案 > 从 ion-list 中的 ion-item 中的按钮获取 ID 信息

问题描述

  <ion-list>
    <ion-item-group *ngFor="let group of groupedContacts">
      <ion-item-divider color="light">{{group.letter}}</ion-item-divider>
      <ion-item *ngFor="let contact of group.contacts" class="contactlist"  style="clear: both;">
        <ion-col>
        <a start no-padding no-margin>{{contact.name}}</a>
        <p start no-padding no-margin>{{contact.number}}</p>
        </ion-col>
          <ion-label>
            <ion-button end float-right round>Tag</ion-button>
          </ion-label>
        </ion-item>
    </ion-item-group>
  </ion-list>

上面的代码是我用来列出我的联系人的代码。

我的目标是让离子标签内的那个离子项目中的按钮在按下时获取该项目的和。contact.namecontact.number

我怎样才能做到这一点?

编辑:这将是由 .ts 文件中的按钮调用的函数

标签: javascripthtmltypescriptionic-framework

解决方案


尝试

<ion-item *ngFor="let contact of group.contacts" ...>
...
    <ion-button (click)="processContact(contact)">Click</ion-button>

</ion-item-group>

并在 .ts 代码中添加功能

public processContact(contact) {
    console.log(contact.name, contact.number);
}

推荐阅读