如何将骨干函数的结果传递给jQuery $ .when()。then()?

时间:2015-08-05 19:56:08

标签: jquery ajax backbone.js jquery-deferred .when

注意:我使用的是jQuery 1.7.2版。

我试图了解jQuery promises和deferred objects。

我有以下代码:

var that = this;
var dataRetrieved = that.retrieveData();
$.when(dataRetrieved).then(function(data) {
   that.formatDataForTemplate(data);
});

retrieveData: function () {
  if ( // condition A ) {
    return window.data.conditionA;
  } else if (// condition B) {
    return window.data.conditionB;
  } else {
    this.fetch({
        success: function (status, response) {
            return response;
        }
    });
  }
}

基本上,我想将从retrieveData返回的任何数据传递到.then()函数中,但它似乎无法正常工作。正在调用retrieveData()函数(使用console.log检查),但未调用formatDataForTemplate

retrieveData()可能会立即返回数据,也可能会从AJAX查询中返回数据(this.fetch({});)。我需要.then()仅在retrieveData返回数据后才会触发。

我认为我不能清楚地理解承诺。如何让我的代码完成我想要做的事情?

编辑:嗯,仍然没有完全掌握它......这是我的更新版本。我试图找出如何返回已使用我的数据解决的承诺。

var that = this;
var dataRetrieved = that.retrieveData();
dataRetrieved.then(function(data) {
    that.formatDataForTemplate(data, that.get('template'));
});


retrieveData: function () {

    var that = this;

    if (window.settings.preview === 'true') {
        return $.Deferred(function(def) {
            def.resolveWith(window.settings.previewData);
        });
    }

    // else if mock (during dev), use mock data.
    else if (this.get('is_mock')) {
        var mocked_data = {
            "title":"Mock Title",
            "description": "Mock Description"
        };
        // return mocked_data;
        return $.Deferred(function(def) {
            def.resolveWith(mocked_data);
        });
    }

    // else, hit API like normal.
    else {
        return $.Deferred(function (def) {
            that.fetch({
                success: function (status, response) {
                    def.resolveWith(response);
                }
            });
        });
    }
},

1 个答案:

答案 0 :(得分:-1)

为此,retrieveData需要返回使用数据解析的承诺。

var that = this;
var dataRetrieved = that.retrieveData();
dataRetrieved.then(function(data) {
   that.formatDataForTemplate(data);
});

retrieveData: function () {

  if ( // condition A ) {
    return window.data.conditionA; // this should be a promise that has been resolved with data
  } else if (// condition B) {
    return window.data.conditionB; // this should be a promise that has been resolved with data
  } else {
    var that = this;
    return $.Deferred(function (def) {
        that.fetch({
            success: function (status, response) {
                def.resolveWith(response);
            }
        });
    });
  }
}