如何在从打字稿中单击 td 元素时检索 tr 元素？答案

【问题标题】：How to retrieve the tr element upon clicking a td element from typescript?如何在从打字稿中单击 td 元素时检索 tr 元素？
【发布时间】：2016-10-22 03:29:09
【问题描述】：

在我的 html 文件中：

<tbody id="tableBody">
     <tr ng-repeat="item in redirectsCtrl.csvData">
          <td style="text-align:center;">{{item.sourceURL}}</td>
          <td style="text-align:center;">{{item.redirectURL}}</td>
          <td style="text-align:center;" ng-click="redirectsCtrl.onEditButtonClick()"><i class="glyphicon glyphicon-pencil"></i></td>
          <td style="text-align:center;"><i class="glyphicon glyphicon-trash"></i></td>
     </tr>
</tbody>

在我的打字稿文件中（angularjs 控制器函数）

public onEditButtonClick() {}

为了澄清，编辑按钮的设计基本上是为了让我可以在表格的一行中编辑一个条目，因此我需要访问该行的条目。因此，当我单击编辑按钮时，我需要其关联的 tr 元素，但是，由于上下文范围，我不能使用 $(this) 在打字稿中检索单击的元素（以及根据定义其父元素）。

任何帮助将不胜感激！

【问题讨论】：

您是否有兴趣获取特定行的item 值或什么？
我想检索元素本身（ng-click 时编辑按钮的 td 元素）

标签： jquery html angularjs typescript

【解决方案1】：

由于 Angular 是 mvc 框架，您可以在控制器中操作数据而不是查看，简单地说：返回这一行：

<td ng-click="redirectsCtrl.onEditButtonClick()">...</td>

到：

<td ng-click="redirectsCtrl.onEditButtonClick(item)">...</td>

在你的控制器中做你的事情：

 onEditButtonClick(item) {
    item.someProp = "someValue"
  }

【讨论】：