title: Ionic framework, displaying two ionicLoading dialogs after one another
body: <p>I am using the ionic framework for a project and have run into an issue with the ionicLoading dialog.</p>
  
  <p>I created a factory that I inject into the different controllers to display certain messages. I display the loading dialog, then call a factory that does a api call. When the service returns a error callback, I hide the dialog. The problem is that when I display a second dialog (right after the loading dialog was closed), it never displays.</p>
  
  <p>This is my displayMessage factory:</p>
  
  <pre><code>factory('displayMessage', function($ionicLoading) {
  
  var displayMessage = {
      // Just displays a loading dialog. You need to call hideDialog to hide it. See LoginCtrl for an example.
      showLoading : function() {
          $ionicLoading.show({
              templateUrl: 'templates/dialogs/loading.html'
          });
      },
      // Hides the loading dialog
      hideLoading : function() {
          $ionicLoading.hide();
      },
      // Hide loading dialog and display toast
      hideLoadingComplex : function(message){
          $ionicLoading.hide();
          $ionicLoading.show({
              template: 'Blah',
              duration : 1500
          });
      },
      // Displays a short toast message (1.5 seconds), requires a string value
      showToastShort : function(message) {
          $ionicLoading.show({
              template: message,
              duration : 1500
          });
      },
      // Displays a long toast message (2.5 seconds), requires a string value
      showToastLong : function(message) {
          $ionicLoading.show({
              template: message,
              duration : 2500
          });
      }
  };
  
  return displayMessage;
  </code></pre>
  
  <p>This is my controller (where I call the code, just the error callback):</p>
  
  <pre><code>.error(function(data, status, headers, config) {
              // If details checked client side, but service returns error code
              if (status === 400 &amp;&amp; !(loginInfo.username.$invalid || loginInfo.password.$invalid)) {
                  errorMessage = 'Incorrect Username or Password';
              } else if (status === 500) {
                  errorMessage = 'Could not connect to server';
              }
  
              console.log("FAILED LOGIN" + errorMessage);
              displayMessage.hideLoadingComplex(errorMessage);
          });
  </code></pre>
  
  <p>All the code fires, the console right before I display the message fires, but the message is never displayed. Can anyone help me resolve this issue? Thank you in advance.</p>