我正在尝试创建一个嵌套(分支)敲除模型/视图为"项目规划应用程序"。数据结构应该如下:
-- Project (projectid,projectname)
|--- Subproject (subid,subname)
目前,我的knockout模型/视图模型看起来像:
//----------------------------
// model "project"
//----------------------------
var project = function ( projectid,
projectname )
{
var self = this;
this.projectid = ko.observable(projectid);
this.projectname = ko.observable(projectname);
}
//------------------------------
// model subproject
//------------------------------
var subproject = function ( subid,
subname )
{
var self = this;
this.subid = ko.observable(subid);
this.subname = ko.observable(subname);
}
//----------------------------
// viewmodel project
//----------------------------
var viewmodel_project = function ()
{
//--------------------------
// projects data/view
//--------------------------
this.projects = ko.observableArray([]);
var projectnumber = 0;
// Add new project (open modal)
this.addproject = function ()
{
projectnumber++;
self.projects.push(new project(projectnumber,"New Project XY"));
};
//--------------------------
// subprojects data/view
//--------------------------
this.subprojects = ko.observableArray([]);
this.selectedsubproject = ko.observable();
var subcounter = 0;
this.addsubproject = function (project)
{
subcounter++;
self.subprojects.push(new subproject(
project.projectid(),
project.projectname() + subcounter));
};
}
在HTML中,我希望在tbody表中显示嵌套模型,我的意思是在"项目"和"子项目"上的嵌套循环中:
<table>
<tr>
<th>Mainprojects and subprojects</th>
<th></th>
<th href="#" data-bind="click: addproject">Add Project</th>
</tr>
<tbody >
<!-- ko foreach: projects -->
<tr>
<td data-bind="text: projectid"></td>
<td data-bind="text: projectname"></td>
<td class="add" href="#" data-bind="click: addsubproject">Add Subproject</td>
</tr>
<!-- ko foreach: subprojects -->
<tr>
<td></td>
<td data-bind="text: subid"></td>
<td data-bind="text: subname"></td>
</tr>
<!-- /ko -->
<!-- /ko -->
</tbody>
</table>
我所能做的就是,我可以添加项目,我可以添加子项目,但我不能让它们嵌套或分支。我不知道如何创建这样的模型:
Project ( projectid,
projectname,
"subprojects array" )
示例(只是数据结构的外观,没有编码):
项目:
Project 100 (
Project ID = 100,
Project Name = "Project 100"
subprojects ( [ Subproject ID = 100.10,
Subproject Name = "Sub Name 10" ],
[ Subproject ID = 100.11,
Subproject Name = "Sub Name 11" ] )
) ,
Project 200 (
Project ID = 200,
Project Name = "Project 200"
subprojects ( [ Subproject ID = 200.10,
Subproject Name = "Sub Name 10" ],
[ Subproject ID = 200.11,
Subproject Name = "Sub Name 11" ] )
)
任何关于如何构造Knockout模型/视图模型的想法都是
1条答案
按热度按时间w7t8yxp51#
看起来您有两个独立的列表:项目和子项目。子项目引用它们所属的项目,但项目不知道它们的子项目。
项目模型应该包含一个子项目数组作为成员,而不是让子项目引用回其父项目,这将为您提供在嵌套
foreach
绑定中尝试利用的嵌套结构。