Angular run after complete

Question

I am new to Angular, so this will be easy to most. I have a service with one function:

.factory('HttpHandler', function () {
    return {
        loadData: function (promise) {
            var self = {
                data: [],
                loading: true,
                promise: promise
            };

            promise.then(function (data) {
                self.data = data;
                self.loading = false;
            });

            promise.finally(function () {
                self.loading = false;
            });

            return self;
        }
    };
});

What I would like, is to be able to run something else after this has completed successfully. Seudo code:

var result = httpHandler.loadData(httpCall, function (complete) {
    console.log('this has completed');
});

Can someone explain to me how I can do this?

Answer 1

Without changing your httpHandler, this is the closest you can get to the behavior you describe in your code:

var resultPromise = httpHandler.loadData(httpCall)
                      .promise
                      .then(function (complete) {
                          console.log('this has completed.')
                      });

However, you probably want to save the result of httpHandler.loadData(httpCall) separately to use the other properties from therein:

var result = httpHandler.loadData(httpCall);
result.promise.then(function () {
    console.log('this has completed: ', result.loading, 
                ' with data: ', result.data);
});