Пользовательское отображение дочернего массива объектов и добавление проверки

Строка JSON получена с сервера, и я пытаюсь настроить карту с помощью плагина KO Mapping, чтобы я мог добавить проверку с помощью плагина проверки KO.

Существует модельный объект с именем Player который имеет свойство с именем Trophies который является массивом объектов.

// Business Objects
var myPlayer = function (player) {
this.ID = ko.observable(player.ID);
this.Name = ko.observable(player.Name).extend({required: true});
this.Rank = ko.observable(player.Rank);
this.Trophies = ko.observableArray(player.Trophies);
}

var myTrophy = function (trophy) {
this.Name = ko.observable(trophy.Name).extend({required: true});
this.Year = ko.observable(trophy.Year).extend({required: true});
}

Я не знаю, как вызвать myTrophy, чтобы я мог сопоставить массив трофеев Custom Map вместе с проверкой.

//KO binding
var playerModel = ko.mapping.fromJSON(jsonString, mapping);
ko.applyBindings(playerModel);

// Mapping
var mapping = {
    'Player': {
        create: function (options) {
            var _player = new myPlayer(options.data);
            return _player;
        }
    }
}

Вот jsfiddle

если вы заметили в jsfiddle, если я удаляю Name Свойство Я получаю сообщение проверки "Это обязательно", так же, как я хотел бы получить сообщение проверки для имени и года трофея. Дайте мне знать, если вам нужно больше деталей. Спасибо

2 ответа

Решение

Есть несколько разных способов добиться этого.

Один из подходов заключается в использовании служебной функции arrayMap для вызова вашей функции для каждой записи в player.Trophies

 this.Trophies = ko.observableArray(ko.utils.arrayMap(player.Trophies, myTrophy));

Тогда поменяй myTrophy вернуть объект

var myTrophy = function (trophy) {
  return { 
           Name:  ko.observable(trophy.Name).extend({required: true}),
           Year: ko.observable(trophy.Year).extend({required: true})
         }
  }

Тебе не нужны твои myPlayer function (а также myTrophy) здесь, потому что вы будете делать то, что плагин уже делает, за исключением проверки.

Вы могли бы сделать это:

// Mapping
var mapping = {
    'Name': {
        create: function (options) {
            return ko.observable(options.data).extend({ required: true });
        }
    },
    'Year': {
        create: function (options) {
            return ko.observable(options.data).extend({ required: true });
        }
    }
}

Плагин будет соответствовать всем свойствам Name а также Year добавить валидацию к ним.

демонстрация

Другие вопросы по тегам