Sencha Touch - 通过嵌套循环访问关联模型存储 JSON答案

【问题标题】：Sencha Touch - Accessing Associated-Model Store JSON via Nested LoopingSencha Touch - 通过嵌套循环访问关联模型存储 JSON
【发布时间】：2011-06-15 07:25:28
【问题描述】：

我已经在 Stack Overflow 上潜伏了很长一段时间，并且找到了很多非常有用的答案。非常感谢社区！我希望能够在不久的将来提供我自己有用的答案。

与此同时，我还有一个我无法弄清楚的问题。我正在使用 Sencha Touch 创建一个基于 Web 的电话应用程序，但在使用嵌套循环遍历某些 JSON 时遇到了问题。我可以获取第一级数据，但不能获取嵌套在第一级中的项目。有点related ExtJS thread，但我决定创建自己的，因为 ExtJS 和 Touch 在微妙但重要的方面存在分歧。无论如何，这里有一些代码可以显示我在哪里：

JSON（截断 - JSON 是 PHP/MYSQL 生成的，目前实际上有三个带有“标题”的子级别，所有这些我都可以访问。这是我无法迭代的子级别“项目” ):

{
"lists": [
    {
        "title": "Groceries",
        "id": "1",
        "items": [
            {
                "text": "contact solution - COUPON",
                "listId": "1",
                "id": "4",
                "leaf": "true" 
            },
            {
                "text": "Falafel (bulk)",
                "listId": "1",
                "id": "161",
                "leaf": "true" 
            },
            {
                "text": "brita filters",
                "listId": "1",
                "id": "166",
                "leaf": "true" 
            }
        ] 
    } 
]

}

商店：

var storeItms = new Ext.data.Store({
    model: 'Lists',
    proxy: {
        type: 'ajax',
        method: 'post',
        url : LIST_SRC,
        extraParams: {action: 'gtLstItms'},
        reader: {
            type: 'json',
            root: 'lists'
        }
    }
});

工作循环：

storeItms.on('load', function(){
    var lstArr = new Array();
    storeItms.each(function(i) {
        var title = i.data.title;
        lstArr.push(i.data.title);
    });
    console.log(lstArr);
});

不工作的嵌套循环：

storeItms.on('load', function(){
    var lstArr = new Array();
    storeItms.each(function(i) {
        var title = i.data.title;
        var id = i.data.id;
        title.items.each(function(l) {
            lstArr.push(l.data.text);
        });
    });
    console.log(lstArr);
});

非工作嵌套循环给我错误“无法调用未定义的方法'each'”，参考'title.items.each ...'

我怀疑这是因为我没有将标题设置为设置键：值对的键，所以它只看到一个字符串列表......但我有点不知所措。

我应该提到，商店是通过两个相互关联的模型填充的。我知道 Store 可以访问所有内容，因为我可以通过 XTemplate 进行嵌套迭代。

我们将不胜感激任何帮助，并希望在不久的将来以实物形式返回社区！'

-埃里克

【问题讨论】：

标签： json sencha-touch nested-loops

【解决方案1】：

埃里克，为什么是循环？

如果您的模型以与 JSON 嵌套相同的方式关联，那么您应该能够在商店中设置 autoLoad:true，坐下来享受吧。

无论如何，假设您出于其他不相关的原因需要这些数组，问题是您正在尝试 .each

i.data.title.items

你当然应该迭代

i.data.items

另外，如果对象是模型，你可以使用 .get() 代替数据对象：

var title = i.get('title);

【讨论】：

感谢您的回复，詹姆斯！完整的数据结构包括各种列表（杂货、待办事项等），以及与每个列表关联的项目。我不能简单地遍历整个集合中的所有项目；相反，我需要遍历列表，并且在每次列表迭代期间，我需要遍历该列表的项目。
我需要这样做的原因是创建一个允许用户编辑列表中的项目的 FormPanel。由于每个列表中的项目数是可变的，因此我不能简单地设置具有一定数量的文本字段的表单并相应地填充它。 The fields have to be created and populated on the fly when a certain list is chosen for editing.我可以通过简单地使用跨度标记类在列表中的每个项目周围生成输入标记来通过 jQuery 实现这一点，但是我正在尝试更“本机”地完成这一点，可以这么说。

【解决方案2】：

使用新的 sencha touch 2 框架，您可以在模型中创建关联，与返回 json 的方式完全相同。检查Sencha Touch 2 Model Document，它会告诉您模型上的各种配置选项。你可以参考ST2 Nested List这个例子。

希望这会有所帮助。

【讨论】：

【解决方案3】：

"title" 不是一个可枚举的对象，它是一个字符串。要迭代字符串，您需要将其拆分以将其转换为数组。

另外，不要使用 Ext.each，而是尝试一个简单的 for (var x in obj) {} 或 for (var xc in obj.prop) {} 如果这样可行，那么 ext.each 方法应该也可以，但如果ext 无法迭代它只会悄悄失败的对象。

【讨论】：