Klikalny wiersz programu startowego o kątowym

Question

Mam stolik w stylu z bootstrapem. Treść tej tabeli jest wypełniana przy użyciu Angular.js. Jak zrobić kliknięcie wiersza, aby wywołać funkcję w zakresie?

Poniższy kod nie działa dla mnie (NG kliknij część):

Tabela:

<table class="table table-hover"> 
     <thead> 
      <tr> 
       <th>Name</th> 
       <th>Status</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr ng-repeat="ingredient in ingredients" ng-click="setSelected({{$index}});"> 
       <td>{{ ingredient.name }}</td> 
       <td>{{ ingredient.status }}</td> 
      </tr> 
     </tbody> 
    </table> 

Kontroler:

$scope.setSelected = function(index) { 
    $scope.selected = $scope.ingredients[index]; 
    console.log($scope.selected); 
}; 

Answer 1

Sugestia i fiddle:

<tr ng-repeat="ingredient in ingredients" ng-click="setSelected();"> 
    <td>{{ ingredient.name }}</td> 
    <td>{{ ingredient.status }}</td> 
</tr> 

<script> 
var myApp = angular.module('myApp',[]); 

function MyCtrl($scope) { 

    $scope.ingredients = [ 
     {'name': 'potato'}, 
     {'name': 'tomato'} 
    ]; 

    $scope.setSelected = function() { 
     $scope.selected = this.ingredient; 
     console.log($scope.selected); 
    }; 

} 
</script> 

Answer 2

Można po prostu przekazać składnik w argumencie

ng-click = "setSelected (składnik)"

i kontroler

$scope.setSelected = function(my_ingredient) { 
     $scope.selected = my_ingredient; 
     console.log($scope.selected); 
    }; 

Answer 3

HTML:

<table class="table-hover"> 

CSS:

.table-hover > tbody > tr:hover { 
    background-color: #f5f5f5; 
} 

A jeśli również Siema wykonane selekcyjnego tr:

HTML:

<tr ng-click="doSomething()"> 

CSS:

tr[ng-click] { 
    cursor: pointer; 
} 

View JSFiddle Sample