使用 Sencha Architect 在数据视图中嵌套 JSON

Question

我想在我的 Sencha Touch 2 项目的数据视图中显示嵌套的 JSON 数据。 JSON 包含带有进度的服务请求的详细信息。

JSON：

{
    "success": true,
    "message": "Request retrieved with id:789",
    "data": {
        "id": 789,
        "description": "request description",
        "subject": "request subject",
        "progresses": [
            {
                "description": "progress description 1"
            },
            {
                "description": "progress description 2"
            },
            {
                "description": "progress description 3"
            }
        ]
    }
}

为了获取数据，我有两个模型，一个用于 requestdetails，一个用于进度，当然还有一个 store。

我的商店：

Ext.define('MyApp.store.RequestStore', {
    extend: 'Ext.data.Store',
    requires: [
        'MyApp.model.RequestModel'
    ],
    config: {
        autoLoad: true,
        autoSync: true,
        model: 'MyApp.model.RequestModel'
    }
});

还有我的模特：

Ext.define('MyApp.model.RequestModel', {
    extend: 'Ext.data.Model',
    uses: [
        'MyApp.model.ProgressModel'
    ],
    config: {
        fields: [
            {
                name: 'id'
            },
            {
                name: 'description'
            },
            {
                name: 'subject'
            }
        ],
        hasMany: {
            associationKey: 'progresses',
            model: 'MyApp.model.ProgressModel'
        },
        proxy: {
            type: 'rest',
            url: 'http://myurl.com/rest/request/789',
            reader: {
                type: 'json',
                rootProperty: 'data'
            }
        }
    }
});

Ext.define('MyApp.model.ProgressModel', {
    extend: 'Ext.data.Model',
    uses: [
        'MyApp.model.RequestModel'
    ],
    config: {
        fields: [
            {
                name: 'description'
            }
        ],
        belongsTo: {
            model: 'MyApp.model.RequestModel'
        }
    }
});

这是我的看法：

Ext.define('MyApp.view.MyDataView', {
extend: 'Ext.dataview.DataView',

config: {
    store: 'RequestStoreId',
    itemTpl: [
        '<div>',
        '   <div>ID</div>',
        '   <div>{id}</div>',
        '           ',
        '   <div>Subject</div>',
        '   <div>{subject}</div>',
        '           ',
        '   <div>Description</div>',
        '   <div>{description}</div>',
        '</div>',
        '',
        '<h2><b>Progress:</b></h2>',
        '<tpl for="progressmodels">',
        '    <div>',
        '        <div>{description}</div>',
        '    </div>',
        '</tpl>'
    ]
}
});

显示id、requestType、description 和subject 工作正常。如果是进度，我希望显示所有进度描述，但现在只显示第一个描述。

我尝试了很多并搜索了互联网以解决它，但我无法弄清楚它是什么。

我在这里做错了什么？我错过了什么吗？有同样问题的人吗？

提前致谢！

Answer 1

更换

<tpl for="progressmodels">

与

<tpl for="progresses">

为我工作。 progresses 节点是我要循环的节点。唯一的缺点是您无法使用模型转换节点中的数据。据我所知，您必须在您的 XTemplate 中执行此操作:)

希望这会对某人有所帮助！