Angular JS: импорт данных JSON с помощью $http.get() — работает в контроллере, а не в сервисе — ПОЧЕМУ?

Я пытаюсь импортировать данные JSON в приложение angularJS. Я разделил свое приложение на контроллер и службу импорта, но оба в разных файлах. Я также использую Bower, grunt и yoman (это из-за работы, я не совсем привык к этим, может быть, тоже проблема.)

Странное поведение:

Я хотел получить данные JSON с помощью $http.get() и разрешить их - все в службе, чтобы я мог передать объект данных оттуда главному контроллеру и не должен был разрешать его там. Странно, я не получил никаких данных, они были пусты или не читабельны. Затем я передал обещание, которое мне возвращает механизм $http.get(), и разрешил его в контроллере. Это не то, что я хотел, но теперь это работает... но почему?

Я предполагаю, что это какая-то ошибка, но ни я, ни члены моей команды не могут ее найти. Как ни странно, создание небольшого тестового приложения без ворчания, йомена и беседки сработало.

Буду признателен за каждый намек или идею... Яна

Вот мой код из НЕ рабочей версии, сначала основной модуль с контроллером:

/** Main module of the application. */
(function () {
  'use strict;'
  angular.module('angularRegelwerkApp', [])
    .controller('RegelwerkCtrl', function ($scope, CategoryFactory) {

      $scope.categories = CategoryFactory.getCategories();
      $scope.subcategories = CategoryFactory.getSubCategories();

    }
  );
})();

Сервисная часть:

(function () {
  'use strict';
  var app = angular.module('angularRegelwerkApp')
    .service('CategoryFactory',
    function ($http) {

      var categories = [];
      var subcategories = [];

      $http.get("../mockdata/categories.json").then(function (response) {
        categories = response.data;
      })
      $http.get('../mockdata/subcategories.json').then(function (response) {
        subcategories = response.data;
      })
      return {
        getCategories: function(){
          return categories;
        },
        getSubCategories: function(){
          return subcategories;
        }
      }
    }
  );
})();

Вот мой код из РАБОЧЕЙ версии, сначала основной модуль с контроллером:

/** Main module of the application. */
(function() {
  'use strict;'
  angular.module('angularRegelwerkApp', [])
    .controller('RegelwerkCtrl', function ($scope, CategoryFactory) {

      $scope.categories = [];
      $scope.subcategories = [];

      CategoryFactory.getCategories().then(function(response) {
        $scope.categories = response.data;
      });
      CategoryFactory.getSubCategories().then(function(response) {
        $scope.subcategories = response.data;
      });
    }
  );
}
)();

Сервисная часть:

(function () {
  'use strict';
  var app = angular.module('angularRegelwerkApp')
    .service('CategoryFactory',
    function ($http, $q) {

      var categoryURL = "../mockdata/categories.json";
      var subcategoryURL = '../mockdata/subcategories.json';

      function getSubCategories() {
        return $http.get(subcategoryURL);
      }
      function getCategories() {
        return $http.get(categoryURL);
      }
      return {
        getCategories: getCategories,
        getSubCategories: getSubCategories
      }
    }
  );
})();