Tried the first approach but got into infinitive loop instead. I am not very comfortable with the second approach.

I guess for now I'll be contend with 2 server hits (but no hits at all afterwards). I hope we will be able to re-design this form to use ui-views instead of the partial views as now. In the latter case the view will only be invoked when clicked on the tab.

>>Hi everybody,
>>
>>I have two pages in the same form that need to access the same data.
>>
>>Each of the pages is controlled by its own controller and both have this code in the init:
>>
>>

>>invoicesService.getMetaData().then(function (data) {
>>                        $scope.invoicesMetaData = data;
>>
>>                    });

>>
>>So, I want to somehow adjust the service code to not invoke the method twice. Here is what I attempted to do but it's not working:
>>
>>

>>app.factory('invoicesService', ['$http', '$q', function($http, $q) {
>>
>>        var metaData = null;
>>
>>        var getMetaData = function () {
>>            if (angular.isObject(metaData))
>>                return metaData;
>>
>>            var deferred = $q.defer();
>>            $http.get('/api/invoices/metadata')
>>                .success(function (data) {
>>                    metaData = data;
>>                    deferred.resolve(data);
>>                    
>>                })
>>                .error(function (data, status, header, config) {
>>                    deferred.reject(status);
>>                });
>>            return deferred.promise;
>>        };

>>
>>I still get 2 hits in my API controller. Do you see how should I change the above to avoid the second call after the first one was already made?
>
>The problem is that the second call could arrive before the $http asynchronous call completes. Something like this might work (untried):

app.factory('invoicesService', ['$http', '$q', function ($http, $q) {
>
>        var metaData = null;
>        var inProcess = false;
>        var getMetaData = function () {
>
>            while (inProcess === true) {
>            }
>
>            if (angular.isObject(metaData))
>                return metaData;
>            inProcess = true;
>            var deferred = $q.defer();
>            $http.get('/api/invoices/metadata')
>                .success(function (data) {
>                    metaData = data;
>                    inProcess = false;
>                    deferred.resolve(data);
>
>                })
>                .error(function (data, status, header, config) {
>                    deferred.reject(status);
>                });
>            return deferred.promise;
>        }
>    }]);

Angular doesn't have a synchronous option for $http so an altenative would be to fall back to using a XMLHttpRequest synchronously:

var req = new XMLHttpRequest();
>    req.open('GET', '/api/invoices/metadata', false); 
>    req.send(null);
>
>    if (req.status === 200) {
>        //etc........