Javascript 使用JSON派生的敲除观察值动态更新视图

希望这不是一个坏的做法，但我正试图在上下文中理解敲除观测值

我想用“红花”或“蓝天”更新视图，具体取决于单击的按钮。让我们假设JSON是静态的。我如何在只应用一次绑定的情况下使用可观察对象来更新视图

小提琴：

HTML: 我如何[…]只应用一次绑定

像这样：

函数示例（数据）{
var self=这个；
self.colors=ko.observearray（）；
self.currentColor=ko.observable（）；
fromJS（数据，{}，self）；
}
var样本=新样本({
“颜色”：[{
“名称”：“蓝色”，
“事物”：[“天空”、“海洋”]
}, {
“名称”：“红色”，
“事物”：[“花”、“太阳”]
}]
});
ko.应用绑定（样本）


我如何[…]只应用一次绑定

像这样：


函数示例（数据）{
var self=这个；
self.colors=ko.observearray（）；
self.currentColor=ko.observable（）；
fromJS（数据，{}，self）；
}
var样本=新样本({
“颜色”：[{
“名称”：“蓝色”，
“事物”：[“天空”、“海洋”]
}, {
“名称”：“红色”，
“事物”：[“花”、“太阳”]
}]
});
ko.应用绑定（样本）

先生，您是冠军中的冠军。几乎每件事都很有道理，但如果你允许我问一个问题，你能解释一下这句话吗<代码>ko.mapping.fromJS（数据，{}，self）
在那里，
{}
和
self
做什么？
{}
是映射选项（在这个简单的示例中没有），而
self
是映射目标。您所涵盖的文档：。我强烈建议花半个小时阅读各种地图选项，它们非常有用。先生，您是冠军中的冠军。几乎每件事都很有道理，但如果你允许我问一个问题，你能解释一下这句话吗<代码>ko.mapping.fromJS（数据，{}，self）

在那里，

{}

和

self

做什么？

{}

是映射选项（在这个简单的示例中没有），而

self

是映射目标。您所涵盖的文档：。我强烈建议您花半个小时阅读有关各种映射选项的所有信息，它们非常有用。

<button class="blue">Blue</button>
<button class="red">Red</button>

<div data-bind="text: name"></div>
<div data-bind="text: things()[0].item1"></div>

<script>
  ko.applyBindings(viewModel);
</script>

var data = {
  "colors": [{
    "name": "blue",
    "things": [{
      "item1": "sky",
      "item2": "ocean",
    }, ]
  }, {
    "name": "red",
    "things": [{
      "item1": "flower",
      "item2": "sun",
    }, ]
  }, ]
};

$('.blue').click(function() {
  var viewModel = ko.mapping.fromJS(data.colors[0]);
});

$('.red').click(function() {
  var viewModel = ko.mapping.fromJS(data.colors[1]);
});