在foreach内淘汰foreach

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了在foreach内淘汰foreach相关的知识,希望对你有一定的参考价值。

举个例子 -

   <!--ko foreach: WorkItems-->
      <tbody data-bind="foreach: ActionPlans">
         // table data here
      </tbody>
   <!--/ko-->

我试图在“表格数据”中仅显示属于当前迭代工作项的行动计划项目。

问题 -

我的问题是,目前“此处的表格数据”显示了所有工作项的所有行动计划。

我的模型结构为Person> WorkItem(array)> ActionPlan(array)

我试过了

   <!--ko foreach: WorkItems-->
      <tbody data-bind="foreach: $parent.ActionPlans">
         // table data here
      </tbody>
   <!--/ko-->

添加$ parent不会显示任何ActionPlans ...

--------------按要求编辑 - -------------------

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:ActionPlan用于每个带有ActionPlan的WorkItem

enter image description here

答案

我不认为你应该包括$parent,因为它已经在WorkItems binding context内。

Fiddle

以上是关于在foreach内淘汰foreach的主要内容,如果未能解决你的问题,请参考以下文章

淘汰赛 JS 选择初始值在 foreach 循环内未正确显示

淘汰赛无法处理“foreach”的绑定

淘汰赛foreach绑定不起作用

如何在淘汰赛 foreach 绑定中使用表单

淘汰赛无法处理绑定“foreach”

淘汰foreach绑定,更新值