javascript - Angular : How to make whole table row clickable within ng-repeat?

Question

我有一张 table 。

<tbody>
    <tr ng-repeat="star in stars">
        <td>
            <a ng-href="/#/stars/{{star.id}}">{{star.id}}</a>
        </td>
        <td>{{star.name}}</td>
    </tr>
</tbody>

它呈现实体。到目前为止，第一列是可点击的。我想让整个表行 ( <tr> ) 可点击。我该怎么做？

Answer 1

您可以放置​​ng-click在你的 <tr> 里面然后在您的 Controller 中有一个函数可以重定向到正确的 URL。像这样:

HTML

<tbody>
    <tr ng-repeat="star in stars" ng-click="goToLink(star)">
        <td>{{star.id}}</td>
        <td>{{star.name}}</td>
    </tr>
</tbody>

Controller

$scope.goToLink = function(star) {
  $location.path('#/stars/' + star.id);
};