programing

AngularJS 출고 시 http가 비어 있음을 반환합니다.

oldcodes 2023. 10. 1. 21:56
반응형

AngularJS 출고 시 http가 비어 있음을 반환합니다.

앵귤러를 시도하고 있습니다.JS 처음입니다.공장을 사용하여 http-get 요청에서 JSON 데이터를 받고 있지만 ax-request가 수행되기 전에 개체가 빈 상태로 반환됩니다.

공장:

myDemo.factory('photosFactory', function($http) {
    var photos = [];

    var factory = {};

    factory.getPhotos = function() {
        $http({
            url: 'content/test_data.json',
            method: 'GET'
        }).success(function(data, status, headers, config) {
            photos = data;
            return photos;
        });
    };
    return factory;
});

컨트롤러:

controllers.AppCtrl = function($scope, $location, $http, photosFactory) {
    $scope.photos = [];
    init();
    function init() {
        $scope.photos = photosFactory.getPhotos();
    }
};

이것이 제가 생각해낸 것입니다.컨트롤러가 $scope을 설정한 경우.photos, 이 값은 ajax 응답으로 채워지기 전에 photo array를 반환하는 것처럼 비어 있습니다.

약속을 반환하고 컨트롤러의 값을 사용하려면 코드를 수정해야 합니다. 더미 수정 코드를 참조하십시오.

myDemo.factory('photosFactory', function($http) {
 return{
    getPhotos : function() {
        return $http({
            url: 'content/test_data.json',
            method: 'GET'
        })
    }
 }
});

그리고 컨트롤러 -

controllers.AppCtrl = function($scope, $location, $http, photosFactory) {
    $scope.photos = [];
    photosFactory.getPhotos().success(function(data){
       $scope.photos=data;
   });
};

q promise 라이브러리를 사용하면 성공적인 기능을 계속 사용할 수 있습니다.

app.factory('Data', function ($http, $q) {
    return {
        ajaxItems: function () {
            var deferred = $q.defer();
            $http({ method: "POST", url: "/Home/GetSearchResults" })
                .success(function (data, status, headers, config) {
                    deferred.resolve(data);
                }).error(function (data, status, headers, config) {
                    deferred.reject(status);
                });
            return deferred.promise;
        }
    }
});

app.controller('ResultsCtrl', ['$scope', 'Data', function ($scope, Data) {
    $scope.get = function () {
        $scope.items = Data.ajaxItems();
        //the model returns a promise and THEN items
        $scope.items.then(function (items) {
            $scope.items = items;
        }, function (status) {
            console.log(status);
        });
    };
}]);

의지를 사용하면 원하는 것을 달성할 수 있고 다음과 비교하여 훨씬 더 많은 제어권을 얻을 수 있습니다.$http

(다음을 포함하는 것을 잊지 마십시오.ngResrouce(애플리케이션에 종속적인 요소로서)

myDemo.factory('photosFactory', function($resource) {
    var factory = {};

    factory.getPhotos = $resource('content/test_data.json', {}, {
        'query': {method: 'GET', isArray: true}
    });
    return factory;
});

controllers.AppCtrl = function($scope, $location, $http, photosFactory) {
    $scope.photos = [];
    init();
    function init() {
        $scope.photos = photosFactory.getPhotos.query();
    }
};

언급URL : https://stackoverflow.com/questions/16336987/angularjs-factory-http-returns-empty

반응형