CODEWITHSUNDEEP
modal-dialogloadingionic-framework
mhkore
mhkore

Reputation: 185

Problems using $ionicLoading and modal view

Something strange is happening to my app. I'm using $ionicLoading to show and hide the loading template when I go to a page of my app. Everything works fine in the current page after the loading template appears, but if I open a modal page in the current view, it'll be showed but I won't be able to interact with the modal view, everything seems frozen. The app continues running but I can't select anything in the modal. I'm pretty sure that $ionicLoading is what is making this problem appears because if I eliminate it, everything works fine.

So, How could I solve it?. 

.controller('AppCtrl', function($scope, $ionicModal, $timeout, $http, $ionicPopover, $rootScope,$ionicLoading) {

 $ionicModal.fromTemplateUrl('templates/nuevoEvento.html', {
    scope: $scope,
     animation: 'slide-in-right'
  }).then(function(modal) {
    $scope.modalEvento = modal;
  });

  // Open the login modal
 $scope.evento = function() {
    $scope.modalEvento.show();
  };

 $scope.closeEvento = function() {
    $scope.modalEvento.hide();
  };

 $scope.showLoading = function() {
    $ionicLoading.show({
      template: 'Loading...'
    });
  };

  $scope.hideLoading = function(){
    $ionicLoading.hide();
  };
})


.controller('EventosCtrl', function($scope, $stateParams, $http, $timeout,$ionicLoading ) {

$scope.init=function(){
    $scope.showLoading();
    $http({method: 'GET', url: BASEPATH + '/eventos'})
      .success(function(data){
        $scope.hideLoading();
        $scope.eventos = data;
        console.log(data);
        var evLeft = [];
        var evRight = [];
        for(var i = 0; i < data.length; i = i + 2){
          evLeft.push(data[i]);
          if(data[i+1]){
            evRight.push(data[i+1]);
          }
        }
        $scope.tarjetasLeft = evLeft;
        $scope.tarjetasRight = evRight;

      })

Upvotes: 0

Views: 3274

Answers (1)

Fernando Fabreti
Fernando Fabreti

Reputation: 4366

You said you cannot interact with the modal view.

Try the option noBackdrop (or even maybe hideOnStateChange)

More info at the docs

Upvotes: 1

Related Questions