Using $ionicLoading inside a factory

Question

Using $ionicLoading inside a factory

Im trying to use $ionicLoading inside a factory. (Coz I thought its a good idea to have the code in one place without repeating it in each controller)

angular.module('<my app>.message', ['ionic'])                                                                                                                                  
   .factory('Message', [function($scope, $ionicLoading){                                                                                                                          

     var messageFactory = {};                                                                                                                                                     

    messageFactory.successMessage = function(message){                                                                                                                           
       $ionicLoading.show({ templateUrl: 'templates/messages/success.html',                                                                                                       
                            noBackdrop: true, duration: 1000 });                                                                                                                  
     }                                                                                                                                                                            
     return messageFactory;                                                                                                                                                       
   }]);

But the problem is I'm getting this error Cannot read property 'show' of undefined, Since the same code works fine in the controller, I'm wondering if this meant to be working inside a controller. If so , my question is how can I avoid using the same code for message boxes inside a project.

thanks in advance

cheers

sam

ionic-framework

Answer 1

You have a syntax problem.

This is my factory for "toasting" messages on browser or device: When running in Cordova, show the native toast. Outside of Cordova, show an Ionic popup ($ionicLoading) for the same period of time. Uses the API for the Toast plugin - message, duration, position. Differences are that: Ionic popup ignores position, and doesn't allow doing anything while it shows.

(requires Toast Plugin)

.factory('Toast', function($ionicLoading, $cordovaToast) {
    return {
        show: function (message, duration, position) {
            message = message || "No message given...";
            duration = duration || 'short';
            position = position || 'top';

            if (!!window.cordova) { // Use the Cordova Toast plugin
                $cordovaToast.show(message, duration, position);
            }
            else {
                duration = 2000;
                $ionicLoading.show( { template: message, duration: duration } );

            }
        }
    };
})