获取表中单击的行-AngularJS

Question

I have the following HTML Code. This is a table that fetches a list of items from costList and displays them in different rows. I want the item value to be displayed on the row click. How do I implement it in Angular. Thank You in advance.

    <table>
        <tr ng-click = "displayItem()" ng-repeat = "item in costList">
            <td>{{item}}</td>
        </tr>
    </table>

Answer 1

ng-click="displayItem(item)"

or you can store the item in displayItem.

$scope.displayItem = function (item) { $scope.currentItem = item; }

<div>{{currentItem}}</div>

Answer 2

It depends on what you mean by "I want the item value to be displayed on the row click". If you just want it to appear when the row is clicked, try this:

HTML

<table>
  <tr  ng-repeat = "item in costList">
    <td ng-click="display = !display">
      <span ng-show="display">{{item}}</span>
    </td>
  </tr>
</table>

Plunkr: https://plnkr.co/edit/BSjv4Bv7Ouf4Y49cAtgx?p=preview

Answer 3

 <table>
        <tr ng-click = "selectedItem = item" ng-repeat = "item in costList">
            <td>{{selectedItem}}</td>
        </tr>
    </table>