通过带有主干和灰尘的未命名数组对象循环

时间:2013-03-26 19:09:52

标签: javascript backbone.js dust.js

我有一个JSON形成,你可以在下面看到。我无法循环并定义要循环的正确点,因为我不熟悉对象中的数组和复杂的JSON。

我主要想要的是关于我的集合的parse / toJSON部分的一些指示,或者我可能在这个特定结构中失败的其他地方。

我正在尝试使用骨干和灰尘循环来自事件和类型名称的值和输出数据。通常我可以通过在视图中定义集合来循环我的JSON,例如这样称呼:

dust.render("dialog-decoderevents-items", { events : currentUser.eventList.toJSON() }, function(err, out) {
            _this.$(".ab-tvg-prg-opt-future").append($(out));
        });

这通常会让我在尘埃中输出一个循环并输出如下数据:

{#events}
{#tvProgram}{name}{/tvProgram}
{type}
{/events}

我已尝试使用此JSON上的数组和当前上下文the dust examples,它会输出没有问题的内容。我认为问题在于我定义的模型和集合的起点。

我的集合中既有解析函数又有toJSON函数。但是我也不知道在模型上定义什么是id,因为你可以看到id是在事件中定义的,而不是在我通常使用它的外部。想法?所有数据都在下面。

JSON

{
"status": null,
"value": [
{
"event": {
    "id": "RWtzdHJlbSBvcHBkcmFnZWxzZTxsZHR2cGQ+MTM2NDMwMDQwMDAwMDxsZHR2cGQ+MTM2NDMwNDAwMDAwMA==",
    "name": "A glorious event",
    "description": "Some long description about the event",
    "startTime": {
        "year": 2013,
        "month": 3,
        "date": 26,
        "hour": 13,
        "minute": 20,
        "seconds": 0
    },
    "endTime": {
        "year": 2013,
        "month": 3,
        "date": 26,
        "hour": 14,
        "minute": 20,
        "seconds": 0
    }
},
"type": "Party"
},
{
"event": {
    "id": "Rmx5aW5nIFdpbGQgQWxhc2thPGxkdHZwZD4xMzY0MzA2NDAwMDAwPGxkdHZwZD4xMzY0MzEwMDAwMDAw",
    "name": "A glorious event",
    "description": "Some long description about the event",
    "startTime": {
        "year": 2013,
        "month": 3,
        "date": 26,
        "hour": 15,
        "minute": 0,
        "seconds": 0
    },
    "endTime": {
        "year": 2013,
        "month": 3,
        "date": 26,
        "hour": 16,
        "minute": 0,
        "seconds": 0
    }
},
"type": "Birthday"
},
{
"event": {
    "id": "UG9pcm90PGxkdHZwZD4xMzY0MzE2NjAwMDAwPGxkdHZwZD4xMzY0MzE5NjAwMDAw",
    "name": "A glorious event",
    "description": "Some long description about the event",
    "startTime": {
        "year": 2013,
        "month": 3,
        "date": 26,
        "hour": 17,
        "minute": 50,
        "seconds": 0
    },
    "endTime": {
        "year": 2013,
        "month": 3,
        "date": 26,
        "hour": 18,
        "minute": 40,
        "seconds": 0
    }
},
"type": "Birthday"
},
{
"event": {
    "id": "VGhlIEJpZyBCYW5nIFRoZW9yeTxsZHR2cGQ+MTM2NDMxOTAwMDAwMDxsZHR2cGQ+MTM2NDMyMDgwMDAwMA==",
    "name": "A glorious event",
    "description": "Some long description about the event",
    "startTime": {
        "year": 2013,
        "month": 3,
        "date": 26,
        "hour": 18,
        "minute": 30,
        "seconds": 0
    },
    "endTime": {
        "year": 2013,
        "month": 3,
        "date": 26,
        "hour": 19,
        "minute": 0,
        "seconds": 0
    }
},
"type": "Birthday"
}]}

模型

var mainEvent = Backbone.Model.extend({
    idAttribute : "id",

    defaults : {
        type: null,
        event : {
            id : null,
            name: null,
            description: null,
            channelId: null,
            startTime: null,
            endTime: null
        }
    }

});

集合

var eventCollection = Backbone.Collection.extend({
model: mainEvent,

parse : function(json, options) {            
    var retr = [], tmp;

    if (json.status === ajaxStatus.success) {

        switch(options.action) {
              default:
                retr = json.value;
                break;    
        }

        if (options.action === "events") {
            currentUser.eventList = new eventCollection(retr, { action : "events" });
        }

    }
    else if (json.status === ajaxStatus.notAuthenticated) {
        currentUser.trigger("notLoggedIn");
        return [];
    }
    return retr;
},
toJSON : function(){

    var ret = this.constructor.__super__.toJSON.call(this);

    // _.each(ret, function (item) {  
    //     console.log('l1'+item);
    //     ret.push(item);

    // });            
    return ret;
}
});

1 个答案:

答案 0 :(得分:1)

快速阅读你的问题之后的想法(因为我之前从未使用过灰尘或骨干,所以请把它拿出来):

难道你不能只为每个事件对象创建一个存储内容数组的控制器吗?这样,在解压缩JSON文件时您所要做的就是将每个事件添加到控制器,并在HTML中迭代它。然后,您可以使用id = event [id]或其他内容提取id。

编辑:这是AJAX的一个例子,我知道你没有使用它,但解析位至少应该有用:

function getParties() {
  $.ajax({
    url: 'json/party.json',
    dataType: 'json',
    async: false,
    success: function(data) {
      console.log("Data:", data.value);
      for (var i=0, occurence; occurence = data.value[i]; i++) {
        var event = {};
        event.type = occurence.type;
        for (var key in occurence.event) {
          event[key] = occurence.event[key];
        }
        console.log("Event:", event);
        // Do something with event... Maybe add to content array.
      }
    }
  });
}

“事件”现在应该是简单的javascript。如果要访问其中的已知字段,可以说例如event [“id”]。要遍历所有值,请使用以下循环。

for (var key in event) {
  console.log("Key: " + key + ", Value: " + event[key]);
}

您还应该能够使用{id}获取值,例如,在Backbone中。当创建的“事件”对象被推送到某个控制器的内容数组时,类似的东西在Ember中起作用,这正是我正在使用的。