Show element after ng-click angularjs

Question

I'm looking for angular-way solution for task:

Imagine, we have many rows like

<tr>
<td>
 <span>click me</span>
 <span style='display: none;'>i'll be shown</span>
</td>
</tr>
...[a lot as the same rows]...

All i want is to show second span and hide first, after click to first span.

p.s. really don't want to use jQuery for this issue.

Answer 1

In the view:

<span ng-click="onItemClicked(currentItem)">click me</span>
<span ng-show="currentItem.isVisible">I'll be shown</span>

And in the controller:

  $scope.onItemClicked = function (item) {
    item.isVisible = true;
  };

Read the documentation about ngShow.

Working demo: http://plnkr.co/edit/FEZ5JDfVfeWKSGOHjBSy?p=preview