gpt4 book ai didi

javascript - ExtJS/Javascript : adding a child Model to a parent Model, 在网格上呈现

转载 作者:行者123 更新时间:2023-11-30 20:40:44 25 4
gpt4 key购买 nike

缩略版: 我有一个子模型,我需要将其添加到父模型,然后添加到商店并在网格中渲染它,现在当我渲染它时,它只显示来自父模型的数据而不是子模型。 在我的 Controller 中,我认为问题出在第 51 行附近:我不知道是否有任何其他方法可以做到这一点,

company.set('employees',employees);

如果我对我的模型的数据进行硬编码,child ('Company' hasMany -> 'Employee') 它在网格中呈现良好。我尝试模拟的模型数据如下

data:{'items':[
{ 'col4': 'Dunder Miflin', "col5":"A paper company", "col6":"The Office",
"count" : 2,
"employees": [{'col1': 'Michael Scott', "col2":"michael@dundermiflin.com", "col3":"555-111-1224" },
{'col1': 'Dwight Schrute', "col2":"dwight@dundermiflin.com", "col3":"555-222-1234"} ]
},
{ 'col4': 'Athlead', "col5":"Sports marketing company", "col6":"The Office",
"count": 1,
"employees": [{'col1': 'Jim Halpert', "col2":"jim@athlead.com", "col3":"555-222-4444"}]
}

]}

fiddle :https://fiddle.sencha.com/#view/editor&fiddle/2efb应用代码在Assets/app/下

当你加载 fiddle 时,第二个网格已经有 2 行,这是 MainStore2 中的硬编码数据。

在顶部的网格标题中,有一个按钮'clickMe',点击它会从 MainStore(grid1 的商店)读取记录并按公司分组并将 col4,5,6 加载为Company 模型和 col1,2,3 作为子模型 Employee 并将 Employees 数组添加到 Company 模型。因此,单击按钮时,它会在下方网格中再添加两条记录,此处会显示 col4、5、6,但是当您展开(左侧的 + - 图标)时,它不会显示子员工行,这与第 1 行和第 2 行不同。这就是我的问题所在。将子模型数组添加到父模型。最后,在 clickMe 事件之后,第 3 行和第 4 行应与第 1 行和第 2 行相同。

非常感谢任何帮助或指点。

详细版:(只有当你需要更清楚我的问题时才阅读它)

fiddle :https://fiddle.sencha.com/#view/editor&fiddle/2efb应用代码在Assets/app/下

enter image description here我在上面的网格中有 3 行,它有两个公司,Dunder Miflin 和 Athlead。 {col4}

点击按钮(标题中的'clickMe')它会读取这个网格存储,并按公司分组(col4),

按 col4 过滤,

1) 我创建了一个“公司”模型的实例,将第 4、5、6 列填充到它,这将分别是 Dunder Miflin、A Paper Company 和 The office。

2) 遍历记录(只有 2 行),创建“员工”模型数组并向其中添加 col1,2,3,并将该员工数组作为其子项添加到公司模型中。这个数组将有,

[{Michael Scott,他的电子邮件,他的电话号码},

{Dwight Schrute,他的电子邮件,他的电话号码}]

在第二个过滤器上,与上面相同,但公司 (Athlead) 和一名员工 (Jim) 不同。

现在将这两个 Company 添加到一个数组中,并将这个 Company 数组添加到属于较低网格的商店中。问题是它显示的是公司而不是员工。最后,在 clickMe 事件之后,第 3 行和第 4 行应与第 1 行和第 2 行相同。

上述算法的伪代码:

var companies = [];

Loop begin:
var company=Ext.create('TestUI.model.Company', record.data);
var employees = [];
var counter=0;

//store1 filterByCol4.
store1.each(function(record){
var employeesModel = Ext.create('TestUI.model.Employee', record.data);
employees.push(employeesModel.data);
});
company.set('employees',employees);
companies.push(company);
loop END;

store2.add(companies);
store2.sync();

非常感谢任何帮助或指点。

最佳答案

最后通过试错想出如何将子模型数组添加到父模型。

“公司”模型是我的 parent 。与子模型'Employee'有很多关系

Ext.define('TestUI.model.Company', {
extend : 'Ext.data.Model',
fields : [
{name: 'col4', type: 'string'},
{name: 'col5', type: 'string'},
{name: 'col6', type: 'string'},
{name: 'count', type: 'int'}
]
,hasMany: [
{model: 'TestUI.model.Employee', name: 'employees'}
],
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'items'
}
}
});

Ext.define('TestUI.model.Employee', {
extend : 'Ext.data.Model',
fields : [
{name: 'col1', type: 'string'},
{name: 'col2', type: 'string'},
{name: 'col3', type: 'string'}
],

proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'employees'
}
}
});

魔术线是:

company.employees().add(employees);

伪代码:

Loop through records and create employee model and add to employee array: {
var employeesModel = Ext.create('TestUI.model.Employee', record.data);
employees.push(employeesModel);
}
end Loop
//create Company model and add array employees to Company.
var company=Ext.create('TestUI.model.Company', record.data);
company.employees().add(employees);

其他变化是我已将代理从商店移动到公司和员工模型。

更新了工作 fiddle :https://fiddle.sencha.com/#view/editor&fiddle/2efb

关于javascript - ExtJS/Javascript : adding a child Model to a parent Model, 在网格上呈现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49299002/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com