Need help on popover usage


I had an onHold() event handler assigned to items in a ng-repeat list. The handler call is used with a parameter which is the list item. In the event handler there’s a confirmation dialog that takes some action on the item depending on user selection. The code is something like this:

<div class="mylist">
  <div class="myitem" 
         ng-repreat="item in items

I’ve got idea of a new function for the onHold() and here comes the Popover. I’ve thought out that I could show a popover on an item hold event with a menu that would allow a user to select an action (e.g. item delete or add to favorite). I can show the Popover in onHold() with a simple call to the show() method, but I don’t understand how to pass the item to the popover while it expects $event. The examples in docs and on codepen are very simple that I can’t think out how to utilize the popover. Culd you please help me?


It is indeed a little tricky to resolve this.

I got it to work with adding an variable to the popover itself.
see my example:

btw don’t you just need the id of the item?


Thank you Auro! This works as I expected :smile:

ID is not needed. Passing an object helps to build delete handler like this:

$scope.products.splice($scope.products.indexOf(product), 1);

and to manipulate the object properties in other methods except delete.



This does not work can you help me with the $scope inside a popover? it does not seem to be reachable!
(Example here : )


Hey @boltex

the popover does have its own scope, thats the reason you can not see myvar
But there is an easy solution:
change the way you prepare your popover and add the scope like this:

$ionicPopover.fromTemplateUrl('templates/popover.html', {
    scope: $scope,
  }).then(function(popover) {
    $scope.popover = popover;

i hope this helps you out.


Yes! Thank you very much sir !!