Question

如果标题解释了我需要达到的目的，我不是，但如果有人提出更好的建议，我可以稍后更改。

我正在使用KO在客户端管理大量数据。

这是基本的。

我有一份培训课程列表
每个都有一个训练课程部分列表
每个培训会话部分都引用其他列表中保存的项目。例如，我有一系列活动（例如：骑自行车，跑步，游泳等）
每个活动都由一个ID标识，该ID在培训会话部分中用于标识用于特定会话的活动。

现在，所有这些列表都存储为可观察数组，列表的每个成员都是可观察的（我使用KO.Mapping来映射来自服务器的JSON）

当我在UI中显示培训课程时，我想显示来自各种列表的各种信息

持续时间：1小时30分活动：骑自行车流程：间隔期

我将训练课程与其组件链接的唯一信息是ID，这很好。我不确定如何将我的活动的名称（文本）数据绑定到<p>或<div>，以便在编辑活动时名称会发生变化（通过使用某些功能）申请）。

训练课程只有识别活动的ID，所以我不知道如何根据活动名称绑定活动名称。

希望这能让人感觉到，有人可以帮助我解决问题。我发现了很多关于如何绑定到可观察数组但没有解决ID和链接信息的信息。

Answer 1

最简单的方法可能是制作自己的构造函数并手动链接数据。如果你真的想要，你可以使用映射，但你基本上必须进行相同的手动链接，只能采用更详细的格式。

这是示例实现的小提琴：http://jsfiddle.net/aKpS9/3/

代码中最重要的部分是链接，您必须注意只创建一次活动对象，并在任何地方使用相同的对象，而不是为部件创建新的活动对象。

var TrainingSession = function(rawData, actualActivities){
    var self = this;
    self.name = ko.observable(rawData.name);
    self.parts = ko.observableArray(ko.utils.arrayMap(rawData.parts, function(rawPart){
        return ko.utils.arrayFirst(actualActivities(), function(ac){
            return ac.ID() == rawPart.ID;
        })
    }));
}

var Activity = function(rawData){
    var self = this;
    self.ID = ko.observable(rawData.ID);
    self.name = ko.observable(rawData.name);
}

var MainVM = function(rawData){
    var self = this;
    //first create an array of all activities
    self.activities = ko.observableArray(ko.utils.arrayMap(rawData.activities, function(rawAc){
        return new Activity(rawAc);
    }));

    self.trainingSessions = ko.observableArray(ko.utils.arrayMap(rawData.trainingSessions, function(session){
        return new TrainingSession(session, self.activities);
    }));

}

Knockoutjs如何基于ID对可观察数组成员进行数据绑定

1 个答案: