Search code examples
javascripthtmlionic-frameworkionic-popover

Ionic Popover "freeze" on open


I have very simple Ionic popover code which is following:

html (main-view.html)

<div>
    <a href="" ng-click="openPopover()">Open Popup</a>
</div>

html (my-view.html)

<ion-popover-view>
    <ion-content>
        <div class="row">
            <div class="col col-90"><h4>{{ 'Test header' }}</h4></div>
            <div class="col col-10">
                <i class="ion-close" ng-click="closePopover()"></i>
            </div>          
        </div>
        <div class="row">
            <div class="col col-100">
                <p>
                    {{ 'Some content here' }}
                </p>
            </div>
        </div>
    </ion-content>
</ion-popover-view>

controller

angular.module('myApp').controller('MainCtrl', function($scope, $rootScope, $ionicPopover){
            $ionicPopover.fromTemplateUrl('views/my-view.html', {
                scope: $scope,
                "backdropClickToClose": false
            }).then(function(popover) {
                $scope.popover = popover;
            });

            $scope.openPopover = function($event){
                $scope.popover.show($event);                 
            };

            $scope.closePopover = function() {
                $scope.popover.hide();        
            };
};

The problem here is whenever I run ionic serve the code works fine, but when I hit the refresh and ionic server is still running and open the popover again, the closePopover() doesn't work at all. Even if I would add an html link inside of it to open other website it won't work.

If I close the ionic server and then reopen it again, it works again as long as I refresh the page.

What could be the problem?

I have checked the ion-close components click listener and everything seems fine. I have tried to recreate the $ionicPopover instantiation whenever user opens the popover but nothing works.

All help is appreciated.


Solution

  • After long inspection and testing I found out that the problem was with <ion-popover-view> component that broke the logic totally. So it seems there is a bug about this component and I have already opened the ticket in Github of Ionic Framework to fix the bug. The issue is located here. Ionic Framework Popover Freeze Issue