[SOLVED] Toast with $ionicLoading.show displayed once but not twice


#1

Hello,

Here is my controller:

angular.module('myApp').controller('NewEvent', function ($scope, ServiceEvent, ServiceHelp, $state, $ionicLoading) {

    $scope.event = new Event("", false, "");

    $scope.ServiceHelp = ServiceHelp;

    $scope.saveEvent = function() {
        ServiceEvent.new($scope.event);
        $ionicLoading.show({ template: 'Event created.', noBackdrop: true, duration: 2000 });
        $state.transitionTo('dashboard');
    };

});

The first time that I call saveEvent, the toast appear (centered: possible to display it at the bottom of the screen ?).
However, after that, is no more displayed even if i called saveEvent again and again (the creation of the event works, but not the display of the toast.

Bugs or I do something wrong ?

Thanks

EDIT : More detail, if I stay on the page (without moving with ui router to an another state/page), no problem. But if I move, no more pop up can be generated.


#2

UP.

More detail if you want …

I’m on dashboard page. I go on “new event” page. (you see the controller code on my first post).
Now, you tap on create event. It create a new event, show the ionic popup and move to dashboard page.

Now, I am on dashboard page and go back to new event page. I create a new event : everything is ok except that no popup appear.

New try : if I stay on new event page (if i remove $state.transitionTo…) , is ok. No matter how many event I created, I get the popup. But when I leave this page and go back on it, I have the bug.

Here is a video of this problem :

Thanks !


#3

Hey @Dahevos, can you provide a codepen of this?


#4

Solved by the help of Mike. Thanks again.
The problem was due to two things:

  • don’t use <body ui-view> but

  • On each page, put all your content inside a

    <ion-view>

That’s it !


#5

It caused by class "loading-active"


#6

now i resolve like this

 $scope.$on('modal.shown',function() {
        setTimeout(function(){
            angular.element(document.querySelector('body')).removeClass('loading-active');
        },50);
    });

How to use in rootScope???


#7

I was been searching for a toast notification plugin for my project. I have created a bower component for toast. Please have a look at the bower component i have created. I think it might help you. I tried using the $ionicLoading, but it restrict whole page to do any user actions. The one i created wont have such drawback. It simultaneously allows the user to perform other actions in the page.