I am using Angular X-Editable to allow users to edit list items in a ng-repeat.
I am using this approach: https://vitalets.github.io/angular-xeditable/#text-btn
However, I have been asked to modify this app so that the user can highlight a row in the repeat by clicking on it and click and edit button elsewhere that would put whichever row was selected into x-editable "edit mode".
Looking at their docs I see no method of doing this, nor the event that would put a row into edit mode. I can get the $index of the row clicked on in my ng-click handler but see no way to put that row into edit mode and capture the edits made.
My ng-repeat is like this so far, which is from the example linked above and shows a "pencil" button for editing that it. It works fine, but how to have all the items editable from one button on a toolbar or the like?
<div class="list-group-item" ng-repeat="level1 in pmt..level1 track by $index">
<button ng-click="textBtnForm.$show()" ng-hide="textBtnForm.$visible">
<i class="fa fa-pencil" aria-hidden="true"></i>
</button>
<span editable-text="level1.name" e-form="textBtnForm">
{{ level1.name || 'empty' }}
</span>
<i class="pull-right fa fa-angle-right fa-lg"></i>
</div>
Note: I know how to hide the buttons, or use a click on the text. The question is not eliminating he repeated buttons, but how to have one button to edit the focused row.
