2014-09-26 72 views
0

我試圖創建一個運行d3 request(本例中爲d3.json())的amd模塊,並從請求中返回數據。我似乎無法弄清楚如何使模塊在返回數據之前等待請求完成。因此,當我嘗試訪問數據時,我在主程序中一直未定義。從amd模塊/ requirejs返回d3請求的結果

define(['app/args'], function(args){ 

    d3.json("resources/waterData.php?stn=" + args.stationID, function (error, data) { 

    var dataToReturn = {}; 

    //Do some stuff with data 

    return dataToReturn; 
    }); 

}); 

這是我想要做的基本結構。我認爲主要的問題是d3.json中的第二個參數是加載數據時的回調函數,所以當我嘗試返回數據時,它並沒有超出模塊範圍。我一直無法弄清楚如何從回調中獲取數據並將其返回到模塊之外。

回答

0

真正的問題是d3.json函數是異步的,所以你不能直接從外部函數返回處理過的數據。解決此問題的一種方法是返回承諾而不是數據本身。您可以使用d3.json回調來解決承諾,然後依賴於數據的其他模塊可以註冊自己的回調,一旦該承諾得到解決,回調就會運行。

例如,如果你使用jQuery的$.Deferred()你可以做到以下幾點:

define(['app/args', 'jquery'], function(args, $){ 

    // CREATE DEFERRED OBJECT 
    var deferred = $.Deferred(); 

    d3.json("resources/waterData.php?stn=" + args.stationID, function (error, data) { 

    var dataToReturn = {}; 

    //Do some stuff with data 

    // RESOLVE NOW THAT THE DATA IS READY 
    deferred.resolve(dataToReturn); 
    }); 

    // RETURN THE PROMISE 
    return deferred.promise(); 

}); 

然後,當你要使用的數據,你可以要求上述模塊,並註冊一個偵聽器將觸發一次數據已準備就緒:

require(['nameOfYourModuleAbove'], function(deferred) { 

    deferred.done(function(data) { 
    // DO SOMETHING WITH YOUR DATA 
    }); 

})