在我的控制器中从工厂加载数据

Question

我正在使用工厂进行我的 API 调用，我希望它们在我的控制器的其余部分发生之前发生。

工厂代码如下：

define(['dashboard/module', 'lodash'], function (module)
{

'use strict';

module.registerFactory('httpApiCallService', function ($http, $q)
{
    var assetsInUse, assetsCoupled;
    var api = { assetsInUse: null, assetsCoupled: null };
    return {

        getData: function() 
        {
            $http.get('/v2/api/inventory/assets/count').success(function (data, status, headers, config)
            {
                var totalAssets = data;
                assetsInUse = { total: data, setup: null };
                assetsCoupled = { total: data };


                $http.get('/v2/api/usage/unused/count').success(function (data, status, headers, config)
                {
                    assetsInUse.setup = [
                                {
                                    value: totalAssets - data,
                                    color: "#1675a9",
                                    highlight: "#1675a9",
                                    label: "is in use"
                                },
                                {
                                    value: data,
                                    color: "#7eb3cf",
                                    highlight: "#1675a9",
                                    label: "is not used"
                                }
                    ]
                    api.assetsInUse = assetsInUse;
                    api.assetsCoupled = assetsCoupled;
                    console.log(api);
                    return api;

                }).error(function (data, status, headers, config)
                {
                    return alert("Something went wrong.");
                });
            }).error(function (data, status, headers, config)
            {
             return alert("Something went wrong.");
            });
        }
    }
});
});

我试图在执行控制器的其余部分之前调用我的工厂：

define(['dashboard/module', 'lodash'], function (module, _) {

'use strict';

module.registerController('DashboardCtrl', function ($scope, $interval, $controller, $http, $q,
               SmartMapStyle, uiGmapGoogleMapApi, SmartMapInstances, httpApiCallService)
{
    //Data

    var defer = $q.defer();

    defer.promise.then(function () {
        console.log('we are doing stuff');
    });

    if (httpApiCallService.getData()) 
    {
        defer.resolve();
    }
    else 
    {
        console.log("promise failed");
    }


});

});

我总是被登录：

"promise failed"

我做错了什么？

Answer 1

您的 getData 方法也在执行异步 http 调用。 getData returns 什么都没有，你的条件总是失败。如果你只想在所有 http 调用都成功时才执行其他控制器的东西，你应该在 getData 中传递你的承诺。它可能看起来像：

module.registerFactory('httpApiCallService', function ($http, $q)
{
    var assetsInUse, assetsCoupled;
    var api = { assetsInUse: null, assetsCoupled: null };
    return {

        getData: function(promiseToResolve) //Here we are sending promise to resolve when everything will be ready
        {
            $http.get('/v2/api/inventory/assets/count').success(function (data, status, headers, config)
            {
                var totalAssets = data;
                assetsInUse = { total: data, setup: null };
                assetsCoupled = { total: data };


                $http.get('/v2/api/usage/unused/count').success(function (data, status, headers, config)
                {
                    assetsInUse.setup = [
                                {
                                    value: totalAssets - data,
                                    color: "#1675a9",
                                    highlight: "#1675a9",
                                    label: "is in use"
                                },
                                {
                                    value: data,
                                    color: "#7eb3cf",
                                    highlight: "#1675a9",
                                    label: "is not used"
                                }
                    ]
                    api.assetsInUse = assetsInUse;
                    api.assetsCoupled = assetsCoupled;
                    console.log(api);
                 //instead of returning api we resolving the promise with 'api'
                    promiseToResolve.resolve(api);

                }).error(function (data, status, headers, config)
                {
                    promiseToResolve.reject();
                    return alert("Something went wrong.");
                });
            }).error(function (data, status, headers, config)
            {
              promiseToResolve.reject();
              return alert("Something went wrong.");
            });
        }
    }
});
});

并在您的控制器中：

var defer = $q.defer();

httpApiCallService.getData(defer) ;

defer.promise.then(function (api) {
    console.log('we are doing stuff and can use api received from backend');
})
.catch(function (){
    console.log("getData failed and we cannot continue");
});

在我的控制器中从工厂加载数据

Loading data from the factory in my controller

factory

controller

promise

angularjs