如何使用Sencha Touch数据模型读取嵌套的JSON结构？ [英] How to read nested JSON structure with a Sencha Touch Data Model?
问题描述
{
父母：{
父：[
{
parentId：1，
children：{
child
{
childId：1，
}，
{
childId：2，
}
]
}，
{
parentId：2，
children：{
child：[
{
childId：1，
}，
{
childId：2，
}
]
}
}
]，
pageNum：1，
pageSize：2
}
}
但是，我不知道数据模型的正确结构应该是什么。我尝试了以下操作，但它不起作用。 BTW，我可以访问父信息。问题在于访问子信息。所以，我想我如何设置关系数据有问题。
Ext.regModel（ ParentModel，{
hasMany：{
model：'ChildrenModel'，
name：'children.child'//不太确定这个位
}，
字段：[
{name：'parentId'，type：'string'}
]，
代理：{
类型：'ajax'，
url：'models.json'，
reader：{
type：'json'，
root：'parents.parent'//这个工程很好
}
}
}）;
Ext.regModel（'ChildrenModel'，{
belongsTo：'ParentModel'，//不太确定这个位
fields：[{name：'childId'，type ：'string'}]
}）;
与数据存储：
Ext.regStore（'ParentModelStore'，{
model：'ParentModel'，
autoLoad：true
}）;
我正在使用以下模板，让我看到父信息，但是我无法从它：
myapp.views.ParentView = Ext.extend（Ext.Panel，{
layout：' card'，
initComponent：function（）{
this.list = new Ext.List（{
itemTpl：new Ext.XTemplate（
'< tpl for =。>'，
'< div>'，
'{parentId}'，//这工作很好
'< / div>'，
'< tpl for =children.child>'，//这不起作用
{childId}
'< / tpl>'，
'< / tpl> '，
），
store：'ParentStore'，
}）;
this.listpanel = new Ext.Panel（{
layout：'fit'，
items：this.list，
}）;
this.items = this.listpanel;
myapp.views.ParentView.superclass.initComponent.apply（this，arguments）;
}，
}）;
Ext.reg（'ParentView'，myapp.views.ParentView）;
我正在努力的是孩子和父元素都被另一个包围元素儿童和父母分别。
任何帮助不胜感激。
Philip
PS如果我删除外部的儿童包装元素，只要离开内部的小孩元素（并将模型定义中的children.child更改为child）代码工作正常。
PPS我正在回答我自己的问题：
Doh！我忘了将children元素添加到ParentModel的字段中。
应该如下（注意：我不需要指定'hasMany'或'协会的元素 - 不太明白为什么这是或什么是包括他们的好处）：
Ext.regModel ParentModel，{
fields：[
{name：'parentId'，type：'string'}，
{name：'children'} //非常重要的添加这个字段
]，
proxy：{
type：'ajax'，
url：'models.json'，
reader：{
type ：'json'，
root：'parents.parent'//这个工程很好
}
}
}）;
Ext.regModel（'ChildrenModel'，{
fields：[{name：'childId'，type：'string'}]
}）;
模板工作正常：
'< tpl for =children.child>'，//此语法也可以。
{childId}
'< / tpl>'，
我添加了一个转换器，允许模板一致地访问模型中的数据，无论是否返回单个对象或数组。
Ext.regModel（ParentModel，{
fields：[
{name：'parentId'，type：'string'}，
{name：'children '，convert：
function（value，record）{
if（value.child）{
if（value.child instanceof Array）{
return value.child;
} else {
return [value.child]; //转换为数组
}
}
return value.child;
}
}
]，
代理：{
类型：'ajax'，
url：'models.js on'，
reader：{
type：'json'，
root：'parents.parent'//这个工程很好
}
}
}）;
注意：我实际上并不需要定义ChildrenModel。我想我可以离开而不定义它，因为Sencha必须自动输入转换。
I've been trying to figure this out all evening but to no avail. I have a JSON structure as follows (coming from another system so I can't change its structure):
{
"parents":{
"parent":[
{
"parentId":1,
"children":{
"child":[
{
"childId":1,
},
{
"childId":2,
}
]
}
},
{
"parentId":2,
"children":{
"child":[
{
"childId":1,
},
{
"childId":2,
}
]
}
}
],
"pageNum":1,
"pageSize":2
}
}
However, I can't figure out what the correct structure for the data models should be. I've tried the following but it does not work. BTW, I can access the parent information. The issue is with accessing the child information. So, I guess there is something wrong with how I've set up the relationship data.
Ext.regModel("ParentModel", {
hasMany: {
model: 'ChildrenModel',
name: 'children.child' // not too sure about this bit
},
fields: [
{name: 'parentId', type: 'string'}
],
proxy: {
type: 'ajax',
url : 'models.json',
reader: {
type: 'json',
root: 'parents.parent' // this works fine
}
}
});
Ext.regModel('ChildrenModel', {
belongsTo: 'ParentModel', // not too sure about this bit
fields: [{name: 'childId', type: 'string'}]
});
with a data store:
Ext.regStore('ParentModelStore', {
model: 'ParentModel',
autoLoad:true
});
I'm using the following template which gets me the parent information, but I can't get the child data from it:
myapp.views.ParentView = Ext.extend(Ext.Panel, {
layout: 'card',
initComponent: function() {
this.list = new Ext.List({
itemTpl: new Ext.XTemplate(
'<tpl for=".">',
'<div>',
'{parentId}', // this works fine
'</div>',
'<tpl for="children.child">', // this doesn't work
{childId}
'</tpl>',
'</tpl>',
),
store: 'ParentStore',
});
this.listpanel = new Ext.Panel({
layout: 'fit',
items: this.list,
});
this.items = this.listpanel;
myapp.views.ParentView.superclass.initComponent.apply(this, arguments);
},
});
Ext.reg('ParentView', myapp.views.ParentView);
What I'm struggling with is the fact that both the "child" and "parent" elements are surrounded by another element, "children" and "parents" respectively.
Any help much appreciated.
Thanks in advance,
Philip
PS If I remove the outer "children" wrapping element and just leave the inner "child" element (and change "children.child" to "child" in the model definition) the code works fine.
PPS I'm answering my own question:
Doh! I forgot to add the "children" element to the ParentModel's fields.
It should be as follows (note: I didn't need to specify the 'hasMany' or 'associations' elements - not too sure why this is or what is the benefit of including them):
Ext.regModel("ParentModel", {
fields: [
{name: 'parentId', type: 'string'},
{name: 'children'} // VERY IMPORTANT TO ADD THIS FIELD
],
proxy: {
type: 'ajax',
url : 'models.json',
reader: {
type: 'json',
root: 'parents.parent' // this works fine
}
}
});
Ext.regModel('ChildrenModel', {
fields: [{name: 'childId', type: 'string'}]
});
The template works fine too:
'<tpl for="children.child">', // this syntax works too.
{childId}
'</tpl>',
I've added a converter to allow the template access the data in the model consistently regardless if a single object or an array is returned.
Ext.regModel("ParentModel", {
fields: [
{name: 'parentId', type: 'string'},
{name: 'children', convert:
function(value, record) {
if (value.child) {
if (value.child instanceof Array) {
return value.child;
} else {
return [value.child]; // Convert to an Array
}
}
return value.child;
}
}
],
proxy: {
type: 'ajax',
url : 'models.json',
reader: {
type: 'json',
root: 'parents.parent' // this works fine
}
}
});
Note: I don't actually need to define the ChildrenModel. I guess I can get away without defining it as Sencha must be automatically type converting it.
这篇关于如何使用Sencha Touch数据模型读取嵌套的JSON结构？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
