Ссылка на сопоставленные дочерние наблюдаемые с KnockoutJS - PullRequest
Новая
       41

Ссылка на сопоставленные дочерние наблюдаемые с KnockoutJS

0 голосов
/ 13 марта 2019

Я хотел бы иметь возможность сопоставлять входящие данные с дочерними объектами и их наблюдаемыми массивами и получать доступ к наблюдаемым в дочерних объектах (в этом примере: Main -> BikeShop (). BikeShopExtra ()).

Кажется, у меня может быть один или другой, но не оба.В приведенном ниже примере происходит сбой в этой строке объекта Main. 

self.MainTest = ko.observable(self.BikeShop().BikeShopExtra());

Структура, к которой я обращаюсь, такова: App - инициализирует Main Main - содержит всю бизнес-логику, аналогичную контроллерув шаблоне MVC BikeShop и Customer - DTOs, аналогично модели представления в шаблоне MVC

У меня есть сломанный пример скелета проблемы, которую я имею: https://jsfiddle.net/Mason240/36gh20p8/52/

window.Application = window.Application || { Config: {}, Models: { }, Mappings: { } };

window.Application.App = (function ($, ko) {

    var init = function (opts) {
       var vm = new Application.Models.Main();
       ko.mapping.fromJS(opts.model, Application.Mappings.Main, vm);
       ko.applyBindings(vm);
    };

    return {
        Init: init
    };

}(jQuery, ko));

window.Application.Models.Main = function () {
    var self = this;

    self.BikeShop = ko.observable();
    self.MainTest = ko.observable(self.BikeShop().BikeShopExtra());
};

window.Application.Models.BikeShop = function () {
    var self = this;

    self.Id = ko.observable();
    self.StoreName = ko.observable();
    self.Customers = ko.observableArray([]);
    self.CompoundId = ko.computed({
      read: function () {
        return self.Id() + "-" + self.StoreName();
      }
    });
    self.BikeShopExtra = ko.observable("Bike Shop Extra");
};

window.Application.Models.Customer = function () {
    var self = this;

    self.Id = ko.observable();
    self.Name = ko.observable();
    self.CompoundId = ko.computed({
      read: function () {
        return self.Id() + "-" + self.Name();
      }
    });
  self.CustomerExtra = ko.observable("Customer Extra");
};

window.Application.Mappings.Main = {
    'BikeShop': {
        create: function (obj) {
            var model = new Application.Models.BikeShop();
            ko.mapping.fromJS(obj.data, Application.Mappings.BikeShop, model);
            return model;
        }
    }
};

window.Application.Mappings.BikeShop = {
    'Customers': {
        key: function (data) {
            return ko.utils.unwrapObservable(data.Id);
        },
        create: function (obj) {
            var model = new Application.Models.Customer();
            if (obj.data) {
                ko.mapping.fromJS(obj.data, {}, model);
            }
            return model;
        }
    }
};

(function ($) {
  Application.App.Init({
    "model" : {
      "BikeShop": {
        "Id": 79605,
        "StoreName": "Valley Bike",
        "Customers": [
          {
            "Id": 54132123,
            "Name": "Greg"
          },
          {
            "Id": 78906344,
            "Name": "Mason"
          }]
      }
    }
  });
})(jQuery);
...