美元.获取JSON请求+填充并返回ARRAY

$.get JSON request + fill and returning ARRAY

本文关键字:返回 ARRAY 填充 获取 JSON 请求 美元      更新时间:2023-09-26

我开始使用一个移动框架LungoJS。我和javascript工作不太好,但我真的想修改这个原始代码:

ORIGINAL.JS

var mock = function() {
        var mock = [];
        for (var i=1; i<=5; i++){
            mock.push({
                id: i,
                name: 'name n'+i,
                description: 'description n'+i
            })
        }
        lng.View.Template.List.create({
            container_id: 'lives',
            template_id: 'show_music_template',
            data: mock    
        })
    }
    return {
        mock: mock
    }

})(LUNGO, App);

这个原始代码工作得很好,很容易,现在我想使用$做请求。get返回一个JSON文件和填充数组,如ORIGINAL.JS:

JSON结果:

    {"result":[
    {"id":"52","username":"jgali","image":"Prova_(live)387.jpeg","name":"Prova (live)","type":"music","language":"Catalan","category":"8","tags":"indie, dine prova, indie live","description":"Aquesta es una prova online de reidiou","licence":"Reidiou License","played":"54","record_time":"45","facebook_id":"1052266203_2342869925158","twitter_hash":"#Provalive","create_date":"2011-11-01 13:04:21"},
    {"id":"52","username":"jgali","image":"Prova_(live)387.jpeg","name":"Prova (live)","type":"music","language":"Catalan","category":"8","tags":"indie, dine prova, indie live","description":"Aquesta es una prova online de reidiou","licence":"Reidiou License","played":"54","record_time":"45","facebook_id":"1052266203_2342869925158","twitter_hash":"#Provalive","create_date":"2011-11-01 13:04:21"}
]}

SERVICE.JS

var mock = function() {
        var mock = [];
        var url = 'http://localhost/app/rest/podcasts';
        var data = {};
        //lng.Service.get = $get
        lng.Service.get(url, data,function(response) { 
            var array = [];
            //Do something with response
             jQuery.each(response.result, function() {
                    mock.push({
                        id: this.id,
                        name: this.name,
                        description: this.description
                    })    
            });
            document.write(mock[1].id);
        });
        lng.View.Template.List.create({
            container_id: 'lives',
            template_id: 'show_music_template',
            data: mock  
        })  
    }
    return {
        mock: mock
    }

问题是在循环外,我不能使用"mock"数组。当然,我犯了几个错误……但有人知道问题出在哪里吗?

谢谢。

问题是$.get()需要时间来执行,因此是异步的。这样的异步调用涉及到callback函数的使用。要访问mock数组,您需要在此回调中嵌套任何内容。

你也可以在jQuery中强制AJAX调用是同步的(尽管我和文档对此提出警告);根据文档:

默认情况下,所有请求都是异步发送的(即设置为默认为True)。如果需要同步请求,请将此选项设置为假的。跨域请求和dataType: "jsonp"请求不支持支持同步操作。请注意,同步请求可能暂时锁定浏览器,在请求时禁用任何操作活跃。

谢谢!正如你所说,我用回调解决了这个问题。

如果有人感兴趣,我把代码贴出来:

App.Services = (function(lng, app, undefined) {
var mock = function() {
        var mock = new Array();
        var url = 'http://localhost/app/rest/podcasts';
        var data = {};
        function getData (url,data,mock,callbackFnk){
            lng.Service.get(url, data,function(response) {
                //Do something with response
                // now we are calling our own callback function
                if(typeof callbackFnk == 'function'){
                  callbackFnk.call(this, response);
                }else{
                    document.write("Error");   
                }
            });
        }
        getData(url,data,mock,function(response){
            jQuery.each(response.result, function() {
                    mock.push({
                        id: this.id,
                        name: this.name,
                        description: this.description
                    })
            });
            lng.View.Template.List.create({
            container_id: 'lives',
            template_id: 'show_music_template',
            data: mock
            })
        })     
    }
    return {
        mock: mock
    }
})(LUNGO, App);