title: How to highlight the table row on mouse hover
body: <p>I have this table:</p>
  
  <pre><code>&lt;div class="container" ng-app="sortApp" ng-controller="mainController"&gt;
  
    &lt;table class="table table-bordered "&gt;  
      &lt;thead&gt;
        &lt;tr&gt;
          &lt;td&gt;
            &lt;a href="#" ng-click="sortType = 'name'; sortReverse = !sortReverse"&gt;
              Sushi Roll 
            &lt;/a&gt;
          &lt;/td&gt;
          &lt;td&gt;
            &lt;a href="#" ng-click="sortType = 'fish'; sortReverse = !sortReverse"&gt;
            Fish Type 
            &lt;/a&gt;
          &lt;/td&gt;
        &lt;/tr&gt;
      &lt;/thead&gt;
  
      &lt;tbody&gt;
        &lt;tr ng-repeat="roll in sushi | orderBy:sortType:sortReverse | filter:searchFish"&gt;
          &lt;td&gt;{{ roll.name }}&lt;/td&gt;
          &lt;td&gt;{{ roll.fish }}&lt;/td&gt;
        &lt;/tr&gt;
      &lt;/tbody&gt;
  
    &lt;/table&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is controller:</p>
  
  <pre><code>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' }
    ];
  
  });
  </code></pre>
  
  <p>Here is <a href="http://jsfiddle.net/d8atdw0t/304/" rel="nofollow">fiddler</a>.</p>
  
  <p>I want to highlight the border of table row on mouse hover using <code>ng-mouseover</code> directive.</p>
  
  <p>How can I implement it?</p>