Question

我有这个简单的工厂，它获取数据文件并将其保存到service.data：

angular.module("tiki").factory("editTiki", ["$http", function($http){

    var service = {}
    service.data = {}

    service.getTikis = function(){

        $http.get("data/tikis.json").success(function(tikis){

            console.log(tikis)
            service.data = tikis

        })

    }

    return service



}])

然后，在控制器中我将它分配给$ scope。这是第一个空的，但当$ http结算时，它应该更新我的工厂，然后用返回的数据更新service.data对象。

angular.module('tiki').controller("tiki.controller.settings.edit", ["$scope", "editTiki", function($scope, editTiki){


    //should return the tikis
    $scope.preview = editTiki.data

    editTiki.getTikis()


    $scope.showEditTikiObject = function(){

        console.log($scope.preview)

    }

}])

但是，我有这个功能来测试数据的内容，它返回一个空对象。那是为什么？

Answer 1

在将service.data = tikis分配给$scope.preview之后，您将重新分配angular.module("tiki").factory("editTiki", ["$http", function($http){ var service = {}; service.data = {}; service.getTikis = function(){ return $http.get("data/tikis.json").success(function(tikis){ console.log(tikis) service.data = tikis; return service.data; }) }; return service; }]); angular.module('tiki').controller("tiki.controller.settings.edit", ["$scope", "editTiki", function($scope, editTiki){ editTiki.getTikis() .then(function () { $scope.preview = editTiki.data; }); $scope.showEditTikiObject = function(){ console.log($scope.preview); }; }])。

你应该做一些承诺。

{{1}}

Answer 2

我最终得到了以下内容。所以这里我不是将范围对象注入工厂，而是使用 $ http 承诺的概念在控制器本身中设置 $ scope 强>服务。希望这会有所帮助。

(function () {
    getDataFactory = function ($http)
    {
        return {
            callWebApi: function (reqData)
            {
                var dataTemp = {
                    Page: 1, Take: 10,
                    PropName: 'Id', SortOrder: 'Asc'
                };

                return $http({
                    method: 'GET',
                    url: '/api/PatientCategoryApi/PatCat',
                    params: dataTemp, // Parameters to pass to external service
                    headers: { 'Content-Type': 'application/Json' }
                })                
            }
        }
    }
    patientCategoryController = function ($scope, getDataFactory) {
        alert('Hare');
        var promise = getDataFactory.callWebApi('someDataToPass');
        promise.then(
            function successCallback(response) {
                alert(JSON.stringify(response.data));
                // Set this response data to scope to use it in UI
                $scope.gridOptions.data = response.data.Collection;
            }, function errorCallback(response) {
                alert('Some problem while fetching data!!');
            });
    }
    patientCategoryController.$inject = ['$scope', 'getDataFactory'];
    getDataFactory.$inject = ['$http'];
    angular.module('demoApp', []);
    angular.module('demoApp').controller('patientCategoryController', patientCategoryController);
    angular.module('demoApp').factory('getDataFactory', getDataFactory);    
}());

使用$ http promise的工厂返回空对象

2 个答案: