I Have A Modal That Opens A Second Modal And Cannot Close The First Modal If Open Then Close The Second

To start I created a codepen and I think the title says it all. I created a service to handle my modals, as seen here .service('ModalService', function($ionicModal, $ionicLoading,

Solution 1:

You assigned all the instances of modal controller returned by $ionicModal.fromTemplateUrl(...).then(modal) function to $scope.modal.

The second instance "overwrites" the first one, so when you close the 2nd and then try to hide the first one using the close button (ng-click="modal.hide()") $scope.modal still points to the 2nd...

So, in your Service you have to store modal controller individually for each instance of $ionicModal. Here is a possible edit to your code:

http://codepen.io/beaver71/pen/dGKBmv

Check also this post: How to create two ionic modal in a cordova app? or this one: Ionic Multiple Modals only last showing