javascript - 使用 Knockoutjs 动态调整页面内容以适应用户选择的语言？

Question

我正在尝试使用 Knockoutjs 根据用户在下拉列表中所做的语言选择来动态更改我网页上标签的语言/内容。

目前我正在为语法而苦苦挣扎。 我在 jsFiddle 中提供了我的情况示例

我能做什么:

• 检索选择的值 (id)。

• 通过手动输入如下索引，从语言数组中检索/显示“选择的”标签内容:

  self.chosenLang = languages[0];
  

我不能做什么:

• 使用选择的值 (id) 从语言数组中检索/显示“选择的”标签内容。像这样:

  self.chosenLang = languages[self.selectedChoice];
  

Answer 1

我已经更新了你的 fiddle :http://jsfiddle.net/dWw7F/14/

我所做的是在 selectedChoice observable 上添加了一个订阅，这样我就可以检测到它何时发生变化。订阅的一个方便之处在于，当订阅​​者被调用时，它们包含发布者的值，因此函数中的参数 choice。

self.selectedChoice.subscribe(function(choice) {
   self.chosenLang(languages[choice]);        
});

然后我将 chosenLang 提升为可观察对象，以便 DOM 检测其上的更改。此更改还使我更改了 html 中的绑定(bind)，我必须在其中使用它:

<p data-bind="text: chosenLang().q3"></p>

请注意，chosenLang() 使用了括号。这是因为我们要访问可观察数据，而不是直接访问可观察数据。