У меня есть одностраничное веб-приложение с перечнем недвижимости, которое я создал с помощью AngularJS, решило обслуживать данные с помощью $ http сервиса, но не работало Кто-нибудь может понять почему?

Ниже приведены следующие три файла, которые, по моему мнению, являются причиной возникновения проблемы. Я знаю, что я мог бы использовать POST, GET, PUT, DELETE, но я намеренно пробовал это с помощью $ http.

Файл mansionsController.js:

angular
    .module('ngMansions')
    .controller('mansionsController', function($scope, mansionsFactory) {

            $scope.mansions;

            mansionsFactory.getMansions().success(function(data) {
            $scope.mansions = data;
            }).error(function(error) {
                console.log(error);
            });      

});

Файл mansionsFactory.js:

angular
    .module('ngMansions')
    .factory('mansionsFactory', function($http) {


    function getMansions() {
        return $http.get('data/data.json');
    }

    return {
        getMansions: getMansions
    }

});

Файл data.json:

 [
        {
            "type": "Condo",
            "price": 220000,
            "address": "214 Grove Street",
            "description": "Excellent place, really nice view!"
        },
        {
            "type": "House",
            "price": 410500,
            "address": "7823 Winding Way",
            "description": "Beautiful home with lots of space for a large family."
        },
        {
            "type": "Duplex",
            "price": 395000,
            "address": "834 River Lane",
            "description": "Great neighborhood and lot of nice green space."
        }
    ];