0

我试图通过 _fail 回调返回一个对象（是的，这意味着运行失败回调），但 failSeries 在控制台中返回为未定义。有任何想法吗？

var ChartModule = (function ( $, HC, HA, window, undefined) {

//Define public object
var pub = {};

//Private methods
var _getChartData = function (URL, sendData) {

    var xhrObject =  $.ajax({
                            url: URL,
                            type: "POST",
                            data: sendData,
                            success: function (result) { },
                            error: function (jqXHR, textStatus, errorThrown) {}
                        });

    _chartDataResponse(xhrObject);
};

var _done = function (data, textStatus, jqXHR) {
    var seriesObject = $.parseJSON(data);
    return seriesObject;
};

var _fail = function(){
    var failSeries = [];
    var seriesData = {
        data: [{y: 7, id: 'pointAssets', color: '#5c8fb8'}, {y:10, id: 'pointLiabilities', color: '#bb77b5'}, {y:-3, id: 'pointResult', color: '#cc5971'}],
    };
    failSeries.push(seriesData);

    return failSeries;
};

var _chartDataResponse = function(xhrObject){
    xhrObject.then(_done, _fail);
};

var _renderChart = function(renderTo, seriesObject){
    console.log("Chart will be rendered to: '" + renderTo + "'");
    console.log(seriesObject);
};

//Public methods
pub.getChartData = _getChartData;
pub.renderChart = _renderChart;

return pub;
})(jQuery, Highcharts, HighchartsAdapter, window, undefined);

然后，我以以下方式使用我的模块来尝试查看成功或失败回调返回的对象：

$(function(){
var x = ChartModule.getChartData("someURL", {test: "test"});
ChartModule.renderChart("breakdown-chart", x);

});

4

2 回答 2

0

我正在尝试通过 _fail 回调返回一个对象（是的，这是为了运行失败回调）。然后，我以以下方式使用我的模块来尝试查看成功或失败回调返回的对象：

不，你不能那样做。回调不返回任何东西。请参阅如何从异步调用返回响应？.

但 failSeries 在控制台中返回未定义。

因为failSeries是您的_fail函数的本地变量，并且不会从中返回任何内容。

有任何想法吗？

回报承诺。然后等到它解决后再调用renderChart（来自回调）。

var ChartModule = (function( $, HC, HA, window, undefined) {

    function getChartData(URL, sendData) {
        return $.ajax({
            url: URL,
            type: "POST",
            data: sendData
        }).then(done, fail);
    }

    function done(data, textStatus, jqXHR) {
        return $.parseJSON(data);
    }

    function fail() {
        // ignore errors, continue with fake data
        return new $.Deferred().resolve([
            {data: [{y: 7, id: 'pointAssets', color: '#5c8fb8'}, {y:10, id: 'pointLiabilities', color: '#bb77b5'}, {y:-3, id: 'pointResult', color: '#cc5971'}]}
        ]);
    }

    function renderChart(renderTo, seriesObject){
        console.log("Chart will be rendered to: '" + renderTo + "'");
        console.log(seriesObject);
    }

    return {
        getChartData: getChartData,
        renderChart: renderChart
    };

})(jQuery, Highcharts, HighchartsAdapter, window, undefined);

$(function(){
    ChartModule.getChartData("someURL", {test: "test"}).then(function(x) {
        ChartModule.renderChart("breakdown-chart", x);
    });
});
于 2014-11-12T17:07:08.597 回答
0

随着对 $.ajax() 的更好理解（和使用），ChartModule将减少到更少的公共方法。尤其 ：

  • 请注意，它$ajax()返回一个承诺，它可以（并且应该）通过getChartData()允许在外部对成功/失败采取相应的操作来返回。
  • then()在内部链接中使用适当的低级错误处理，getChartData()您可以发出错误消息，并且在调用的地方可以使用假的 seriesData ChartModule.getChartData()。
var ChartModule = (function ( $, HC, HA, window, undefined) {
    //Private members
    var fakeSeriesData = { data: [{y: 7, id: 'pointAssets', color: '#5c8fb8'}, {y:10, id: 'pointLiabilities', color: '#bb77b5'}, {y:-3, id: 'pointResult', color: '#cc5971'}] };
    function _getChartData(URL, sendData) {
        return $.ajax({
            url: URL,
            type: "POST",
            data: sendData,
            dataType: 'json'
        }).then(null, function (jqXHR, textStatus, errorThrown) {
            var e = new Error(textStatus);
            e.seriesData = getFakeSeriesData();
            return e; //return an augmented Error object.
        });
    }
    function _renderChart(renderTo, seriesObject) {
        console.log("Chart will be rendered to: '" + renderTo + "'");
        console.dir(seriesObject);
        return ...;//something meaningful
    }
    function _getFakeSeriesData() {
        return $.extend({}, fakeSeriesData);
    }
    //Public methods
    return {
        getChartData: _getChartData,
        renderChart: _renderChart,
        getFakeSeriesData: _getFakeSeriesData//make the fake series data directly availalbe.
    };
})(jQuery, Highcharts, HighchartsAdapter, window, undefined);

该策略将允许在调用的地方执行控制ChartModule.getChartData()，而不假设可能对 AJAX 的成功或失败采取什么行动，除了错误时，在不知道如何/是否会的情况下使假的 seriesData 可用用过的。

调用如下：

$(function() {
    ChartModule.getChartData("someURL", {
        test: "test"
    }).done(function(seriesData) {
        ChartModule.renderChart("breakdown-chart", seriesData);
    }).fail(function(error) {
        if(error.seriesData) {
            console.log(error.message);
            ChartModule.renderChart("breakdown-chart", error.seriesData);
        } else {
            console.error(error);
            //some othe couse of action
        }
    });
});

在您的代码中的其他位置，您可以调用ChartModule.getChartData()并采取完全不同的操作作为响应。如果出错，您甚至可以注入其他一些虚假的 seriesData，无论出于何种原因，它们都比默认值更合适。

于 2014-11-13T07:11:19.807 回答