首页 > 解决方案 > 如何通过在角度 8 中选中的复选框获取表的 td 值

问题描述

我的问题很简单。我试图通过选中复选框来获取 td 值。当我单击复选框时,我想获得相同的行产品名称。怎么做?

演示:https ://stackblitz.com/edit/angular-ol2sir?file=src/app/app.component.ts

app.component.ts:

 getProoduct(e){ 
     if(e.target.checked) 
      { 
       const target = e.originalEvent.toElement.closest('tr'); 
       let tdProduct= target.querySelector('td:nth-child(3)').innetText; 
       console.log(tdProduct); 
      }  
 }

标签: javascripttypescriptangular8

解决方案


只需将您的复选框 td 替换为

    <td> <input type="checkbox" [(ngModel)]="data.isSelected" (change)="getProoduct(data.isSelected, data.product_name)"> </td>

现在的功能与

  getProoduct(isSelected, product){
    console.log(isSelected, product)
  }

完整的工作示例:https ://stackblitz.com/edit/angular-glxfq5

实际上,您可以直接传递data给该函数并拥有所有可用的字段以防您p_id将来还需要或任何其他字段。


推荐阅读