【发布时间】:2019-03-16 10:11:10
【问题描述】:
举个例子——
<!--ko foreach: WorkItems-->
<tbody data-bind="foreach: ActionPlans">
// table data here
</tbody>
<!--/ko-->
我试图在“此处的表格数据”中仅显示属于当前迭代 WorkItem 的 ActionPlan 项。
问题 -
我的问题是当前“此处的表格数据”显示所有工作项的所有操作计划。
我的模型结构为 Person > WorkItem(array) > ActionPlan(array)
我试过了
<!--ko foreach: WorkItems-->
<tbody data-bind="foreach: $parent.ActionPlans">
// table data here
</tbody>
<!--/ko-->
添加 $parent 不会显示任何行动计划...
------------- 按要求编辑 - --------
var PersonViewModel = function(data) {
var self = this;
ko.mapping.fromJS(data, trainingCourseItemMapping, self);
self.addWorkItem = function() {
var WorkItem = new WorkItemVM({
Id: null,
JobSkillsAndExpDdl: "",
JobSkillsAndExperience: "",
ActionPlans: ko.observableArray(),
PersonId: data.Id
})
self.WorkItems.push(WorkItem)
};
self.addActionPlan = function () {
var actionPlan = new ActionPlanVM({
Id: null,
priorityAreaStage: "",
goal: "",
action: "",
byWho: "",
byWhen: ""
WorkItemId: data.Id
});
self.ActionPlans.push(actionPlan);
};
}
数组映射
var trainingCourseItemMapping = {
'WorkItem': {
key: function(workitem) {
return ko.utils.unwrapObservable(workitem.Id);
},
create: function(options) {
return new WorkItemVM(options.data);
},
'ActionPlans': {
key: function (actionPlanItem) {
return ko.utils.unwrapObservable(actionPlanItem.id);
},
create: function (options) {
return new ActionPlanVM(options.data);
}
}
}
数组项映射
var WorkItemVM = function(data) {
var self = this;
ko.mapping.fromJS(data, trainingCourseItemMapping, self);
}
var ActionPlanVM = function(data) {
var self = this;
ko.mapping.fromJS(data, {}, self);
}
编辑 2 ----------
这是渲染的 HTML,您可以看到它渲染了一个 foreach:ActionPlans for each WorkItem with an ActionPlan
【问题讨论】:
-
你能展示你的javascript代码吗?
-
谢谢,已添加 JS。
标签: knockout.js knockout-2.0 knockout-mapping-plugin