david.carm david.carm - 5 months ago 12
Javascript Question

Sidebar closes when deleting element of array

I'm using mobile angular ui to open and close a sidebar. In this sidebar a user can search for persons and add or remove these from an array.

I have this repeat that shows the array of persons when clicking on the

<a ...></>
it closes the sidebar:

<li ng-repeat="recipient in persons.recipients">
<span class="wrapper">
<span class="imageWrap">
<span class="initials">
{{recipient.firstName.charAt(0)}}{{recipient.lastName.charAt(0)}} </span>
<a href="" class="trash" ng-click="removeRecipient($index);"><i class="fa fa-trash-o" aria-hidden="true"></i></a>
<span class="details">
<span class="info">
{{recipient.firstName}} {{recipient.lastName}}
<span class="persnr">{{recipient.employeeID}}</span>

The above html snippet is from a directive that is in the sidebar.
function looks like this:

$scope.removeRecipient = function(index) {

The function works but closes the sidebar and I can't figure out why it does this. So each time a user removes a recipient it has to swipe the sidebar open again. How do I keep this sidebar open?



I solved my problem by adding
in the
right behind the


From doc, there was one line.

You can put ui-turn-off='uiSidebarLeft' or ui-turn-off='uiSidebarLeft' inside the sidebar to make it close after clicking links inside them.

so may be you can use that or you can use or you can do like below.


for that you need to pass $event in

<a href="" class="trash" ng-click="removeRecipient($index,$event);"><i class="fa fa-trash-o" aria-hidden="true"></i></a>

so in code, you can write.

$scope.removeRecipient = function(index,e) {

I didn't used same tool, but may be this is issue.