Show/Hide button onclick in ng-repeat

Question

Hy guys, I'm having troubles showing and removing button in ng-repeat.

<div class="row" ng-repeat="a in b">
   <button type="button" ng-click="add()">+</button>
   <button type="button" ng-click="remove()">-</button>
</div>

it's repeating b times, I want to be visible only add button and on click i want to hide add button and show remove button, but only in that exact iteration. I don't want other repeats to be affected. Also for remove button on click I want to hide it and show add button again.

I could do it inside controller or inline.

Thanks in advance!

Answer 1

You should have some property in a like "added" or "remove" then you can check is added is true or if remove is true

<div class="row" ng-repeat="a in b">
   <button type="button" ng-if="!a.added" ng-click="add(a)">+</button>
   <button type="button" ng-if="a.added" ng-click="remove()">-</button>
</div>

You on click method would be

function add(x) {
 ... code here
 x.added = true
}