AngularJs 重定向

Question

我有一个表，其中 1 行 必须链接到其他内容。

现在我得到的是这样的:

<table class="table table-hover">
    <thead>
    <tr>
        <th>Functie</th>
        <th>Bedrijf</th>
        <th>Naam</th>
        <th>Achternaam</th>
    </tr>
    </thead>
    <tbody ng-show="!homeCtrl.loading">
    <tr ng-repeat="employee in homeCtrl.employees" ng-click="homeCtrl.redirectToShow(employee.EmployeeId)">
        <td>{{  employee.Role }}</td>
        <td>{{  employee.Company }}</td>
        <td>{{  employee.FirstName }}</td>
        <td>{{  employee.LastName }}</td>
        <td ng-show="homeCtrl.canEdit" ng-click="homeCtrl.redirectToEdit(employee.EmployeeId)"><span class="glyphicon glyphicon-pencil"></span></td>
    </tr>
    </tbody>
</table>

最后一个td必须链接到其他内容。但现在所有链接都指向相同的内容，我该如何管理呢？

(In the ng-click method I redirect)

Answer 1

您当前的实现存在两个问题。

1. 您可以使用 $last 绑定(bind)点击事件以在最后一个元素上触发。我已将 $last 放在 homeCtrl.redirectToEdit 函数调用之前，因为这将确保直到 $last(ng-repeat 的最后一个元素 出现)行被单击，然后只有它会调用下一个函数。

   ng-click="$last && homeCtrl.redirectToEdit(employee.EmployeeId);$event.stopPropagation()" 
   

2. 我认为您面临与事件冒泡相关的问题，其中您将点击事件绑定(bind)到子元素和父元素。因此，当内部元素内部发生单击事件时，它将将该事件传播到其父元素。为了避免这种不需​​要的行为，您应该通过在内部 td 上调用 $event.stopPropagation() 来停止内部事件冒泡。