Нокаутом foreach внутри foreach - PullRequest
Новая
       36

Нокаутом foreach внутри foreach

0 голосов
/ 11 октября 2018

Возьмем, к примеру, - 

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

Я пытаюсь показать в «табличных данных здесь» только элементы ActionPlan, которые принадлежат текущему итерированному WorkItem.

Issue -

Моя проблема в том, что в настоящее время «данные таблицы здесь» отображают все ActionPlans для всех рабочих элементов.

Моя модель структурирована как Person> WorkItem (массив)> ActionPlan (массив)

Я пытался 

   <!--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: ActionPlans для каждого WorkItem с ActionPlan

enter image description here

1 Ответ

0 голосов
/ 11 октября 2018

Не думаю, что вам нужно включать $parent, поскольку оно уже внутри WorkItems binding context.

Fiddle

...