javascript - Angular $q.defer() 返回 Object{then : function}

标签 javascript angularjs

我有以下 Angular 文件,我在其中尝试使用 $http 访问数据库,然后在 $scope 变量中使用此数据(以显示在网页中)。问题是我无法让 $q.defer 像我认为的那样运行。 $http 函数中的 console.log() 记录一个包含从数据库返回的数据的对象。但是,当我调用该函数时,它会记录 Object {then: function}。数据包含在此对象中,但它不是对象的唯一部分。 (好像是在 Object.$$v 里面。我不太确定那是什么意思。)

var app = angular.module("app", []);

app.factory('portfolioFactory', function ($http, $q) {
        var obj = {};
    obj.getResponse = function(){
        var deferred = $q.defer();
        $http.get('./../includes/portfolio/db_access.php').success(function(data){
                deferred.resolve(data);
                console.log(data);
        });
        //console.log(deferred.promise);
        return deferred.promise;
    }
    return obj;
});

app.controller("PortfolioCtrl", function($scope, portfolioFactory) {
    $scope.PortfolioItems = portfolioFactory.getResponse();
    console.log($scope.PortfolioItems);
});

最佳答案

$http.get( ... );

返回 promise .

app.controller("PortfolioCtrl", function($scope, portfolioFactory) {
    portfolioFactory.getResponse().then(function(response) {
        $scope.PortfolioItems = response.data;
    })
});

会起作用。

在 Angular 的旧版本中 $scope.PortfolioItems = portfolioFactory.getResponse(); 也可以工作,但在较新的版本中,Angular 不再自动解包 promise 。

Promise 基本上是处理异步操作的另一种更好的方式(design pattern)。 您可以使用 promise.then( callback ) 将回调放入队列中,而不是以常规方式使用回调。然后,无论何时调用 deferred.resolve 方法,都会使用结果调用回调。如果 promise 已经在排队的回调之前得到解决,它们将立即使用缓存数据调用。比执行经常变成 callback hellquery( callback ) 代码要好得多.

仅供引用,您宁愿这样做,因为任何 $http 调用的结果已经是一个 promise :

app.factory('portfolioFactory', function ($http) {
    var obj = {};

    obj.getResponse = function(){
        return $http.get('./../includes/portfolio/db_access.php').then(function(data){
           console.log(data);
           return data; //Return data further up the chain.
        });
    }
    return obj;
});

关于javascript - Angular $q.defer() 返回 Object{then : function},我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20484146/

相关文章:

javascript - AngularJS 解决依赖关系

javascript - Angular - 表的多列过滤器

javascript - 如何在 linux 上安装 electron.js?

AngularJS - 如何以编程方式创建一个新的、独立的范围?

javascript - 在Angularjs中使用rest api上传图像

javascript - 匹配字符串中的单词并使它们小写

javascript - 测试未在 karma/jasmine/require.js 上运行 'There is no timestamp for *lib*!' 错误

javascript - 在输入时按下回车键时注入(inject) HTML

javascript - 如何防止在特定 HTML 元素上执行 javascript/jquery?

javascript - CSS/JS - 禁用点击事件但允许在 DIV 上滚动