javascript - The promise of a promise again (Angular JS)

Question

Updated with HTTP and initial code based on requests/Please look at the bottom of the post:

I've been posting several questions on my AngularJS learning curve of late and the SO community has been fantastic. I've been a traditional C programmer when I used to program and have recently started writing my own ionic/Angular JS app. I'm struggling with the promise version of traditional async calls when it comes to converting a custom function to a promise. I don't think I really understood and I find various examples very contrived. I'd appreciate some help. I have some code which is not working, and I have some conceptual questions:

Let's take this simple function:

angular.module('zmApp.controllers').service('ZMDataModel', function() { return { getMonitors: function () { return monitors; } }

getMonitors is a simple function that basically returns an array of monitors. But here is the rub: When the app first starts, I call an http factory that does an http get and goes about populating this monitor list. This http factory is different from this service but invokes a setMonitor method in this service to populate the array. When the array is populated, a variable called 'monitorsLoaded' is set to 1. When this variable is set to 1, I know for sure monitors is loaded.

Now, I have a view with a controller called "MontageCtrl". I want to wait for the monitors to load before I show the view. In a previous post, one person suggested I use route resolve, but I had to first convert my getMonitors to a promise. So here is what I did:

angular.module('zmApp.controllers').service('ZMDataModel',  function($q) {
getMonitors: function () {

            var _deferred  = $q.defer();
            if (monitorsLoaded!=0)
            {
                console.log ("**** RETURNING MONITORS *****");
                    _deferred.resolve(monitors);
            }
            console.log ("*** RETURNING PROMISE ***");
            return _deferred.promise;
        },

Next up, in app.js I connected the route as follows:

 .state('app.montage', {
               data: {requireLogin:false},
            resolve: {
                        message: function(ZMDataModel) 
                        {
                            console.log ("Inside app.montage resolve");
                          return ZMDataModel.getMonitors();
                        }
            },

Answer 1

I finally solved all the problems. There were various issues with my initial attempts. My final resolved solution is here Am I returning this promise correctly?

The learnings:

a) Separating the HTTP get into a factory and the data model into another service was unnecessarily complicating life. But that separation was not the problem. Infact, the way the promise was coded above, on first run, if monitorsLoaded was 0, it would simply return the deferred promise and there was no ".success" or similar construct for me to get into the resolve code block again.

b) The biggest thing that was making me run around in loops was deferring or rejecting was simply setting a state. the return always has to be the promise - and it would return the state you set. I assumed return d.promise always means returning "in progress".