如何在鼠标悬停时突出显示表格行

我有这张桌子:

<div class="container" ng-app="sortApp" ng-controller="mainController">

  <table class="table table-bordered ">  
    <thead>
      <tr>
        <td>
          <a href="#" ng-click="sortType = 'name'; sortReverse = !sortReverse">
            Sushi Roll 
          </a>
        </td>
        <td>
          <a href="#" ng-click="sortType = 'fish'; sortReverse = !sortReverse">
          Fish Type 
          </a>
        </td>
      </tr>
    </thead>

    <tbody>
      <tr ng-repeat="roll in sushi | orderBy:sortType:sortReverse | filter:searchFish">
        <td>{{ roll.name }}</td>
        <td>{{ roll.fish }}</td>
      </tr>
    </tbody>

  </table>

</div>

这是控制者:

angular.module('sortApp', [])

.controller('mainController', function($scope) {
  $scope.sortType     = 'name'; // set the default sort type
  $scope.sortReverse  = false;  // set the default sort order
  $scope.searchFish   = '';     // set the default search/filter term

  // create the list of sushi rolls 
  $scope.sushi = [
    { name: 'Cali Roll', fish: 'Crab' },
    { name: 'Philly', fish: 'Tuna' },
    { name: 'Tiger', fish: 'Eel' },
    { name: 'Rainbow', fish: 'Variety' }
  ];

});

这里是提琴手.

我想使用ng-mouseover指令在鼠标悬停时突出显示表格行的边框.

I want to highlight the border of table row on mouse hover using ng-mouseover directive.

我该如何实施?