在可点击的 table 行中添加可点击元素

Question

假设我有一个 table 行，其中包含一个可点击元素：

  <tr ng-repeat="product in products" onclick="showProductDetail()">
      <td>{{product.id}}</td>
      <td>{{product.title}}</td>
      <td>{{product.price}}</td>
      <td>
        <switch id="enabled" name="enabled" ng-model="product.enabled" ng-change="enableProduct()"></switch>
      </td>
  </tr>

我正在使用 Angular UI Switch，但问题对于任何可点击的元素都是一样的。

如何使行可点击但隔离开关的行为？目前，它试图同时执行这两种操作，从而导致行为不稳定。我知道我可以让除了最后一个单元格之外的每个单元格都可以点击，但是有没有更简洁的方法？

Answer 1

我相信 <switch> 处理程序应该停止事件传播。尝试从您的 ng-change 处理程序中 return false。例如

ng-change="enableProduct(); return false"

Answer 2

如果 Dmitry 的回答无效。

尝试使用 enableProduct($event)

调用 ng-change

然后在该函数中调用

function enableProduct($event) {
   $event.stopPropagation();
   ...
}

在可点击的 table 行中添加可点击元素

Add clickable element within a clickable table row

javascript

angular-ui