How to display an Ionic popup from a popover option?

Question

I have a popover in my Ionic framework app with to options: share and delete. I need to display a confirmation popup when the delete option is chosen, but I don't know how.

How can this be done? Do I need to create a separate controller for the popover? I already did a popup comming from a ActionSheet but this is somehow different.

This is the controller:

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

// Triggered on a button click, or some other target
$scope.openPopover = function($event) {

    $scope.popover.show($event);
}; 

And this is the popover template:

<ion-popover-view style="height: 120px">
  <ion-content>
    <div class="list">
      <a class="item">
        Compartir
      </a>
      <a class="item">
        Eliminar
      </a>
    </div>
  </ion-content>
</ion-popover-view>

Answer 1

You can place an ng-click on your delete (or Eliminar in your template, I think?)

<ion-popover-view style="height: 120px">
  <ion-content>
    <div class="list">
      <a class="item">
        Compartir
      </a>
      <a class="item" ng-click="showConfirm()">
        Eliminar
      </a>
    </div>
  </ion-content>
</ion-popover-view>

---

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

// Triggered on a button click, or some other target
$scope.openPopover = function($event) {

    $scope.popover.show($event);
}; 

$scope.showConfirm = function() {
   var confirmPopup = $ionicPopup.confirm({
     title: 'Are you sure?',
     template: 'Are you sure you want to delete?'
   });
   confirmPopup.then(function(res) {
     if(res) {
       console.log('You are sure');
     } else {
       console.log('You are not sure');
     }
   });
 };