Return factory data to controller always undefined

Trying to return data from the factory and logging within the factory outputs the correct data, but once passed to the controller it is always undefined. If I have my factory logic inside the controller it will work fine. So it must be something simple Im missing here?

Application

var app = angular.module('app', []);

    app.controller('animalController', ['$log', '$scope', 'animalResource', function($log, $scope, animalResource) {
        $scope.list = function() {
            $scope.list = 'List Animals';
            $scope.animals = animalResource.get(); // returns undefined data
            $log.info($scope.animals);
        };
        $scope.show = function() {};
        $scope.create = function() {};
        $scope.update = function() {};
        $scope.destroy = function() {};
    }]);

    app.factory('animalResource', ['$http', '$log', function($http, $log) {
        return {
            get: function() {
                $http({method: 'GET', url: '/clusters/xhrGetAnimals'}).
                    success(function(data, status, headers, config) {
                        //$log.info(data, status, headers, config); // return correct data
                        return data;
                    }).
                    error(function(data, status, headers, config) {
                        $log.info(data, status, headers, config);
                    });
            },
            post: function() {},
            put: function() {},
            delete: function() {}
        };
    }]);

Log Info

[Object, Object, Object, Object, Object, Object, Object, Object, Object, Object]
    200 function (name) {
        if (!headersObj) headersObj =  parseHeaders(headers);

        if (name) {
            return headersObj[lowercase(name)] || null;
        }

        return headersObj;
    } Object {method: "GET", url: "/clusters/xhrGetAnimals"}

Your get() method in service is not returning anything. The return inside the success callback only returns from that particular function.

return the $http object

Che this example that is how you use the promises and you return the factory then you access the methods injecting the service on your controller Use dot syntax to access the function you define on the service 

'use strict';
        var app;

        app = angular.module('app.formCreator.services', []);

        app.factory('formCreatorService', [
          '$http', '$q', function($http, $q) {
            var apiCall, bjectArrarContainer, deferred, factory, webBaseUrl, _getFormElementsData;
            factory = {};
            deferred = $q.defer();
            bjectArrarContainer = [];
            webBaseUrl = 'https://tools.XXXX_url_XXXXX.com/XXXXXXX/';
            apiCall = 'api/XXXXX_url_XXXX/1000';
            _getFormElementsData = function() {
              $http.get(webBaseUrl + apiCall).success(function(formElements) {
                deferred.resolve(formElements);
              }).error(function(err) {
                deferred.reject(error);
              });
              return deferred.promise;
            };
            factory.getFormElementsData = _getFormElementsData;
            return factory;
          }
        ]);

then do it like this for example

 'use strict';
            var app;

            app = angular.module('app.formCreator.ctrls', []);

            app.controller('formCreatorController', [
              'formCreatorService', '$scope', function(formCreatorService, $scope) {
                $scope.formElementsData = {};
                formCreatorService.getFormElementsData().then(function(response) {
                  return $scope.formElementsData = response;
                });
              }
            ]);