使用Knockoutjs动态调整页面内容以供用户选择语言?

时间:2012-04-25 13:36:58

标签: javascript knockout.js localization

我正在尝试使用Knockoutjs根据用户在下拉菜单中进行的语言选择动态更改网页上标签的语言/内容。

目前我正在努力学习语法。 我在jsFiddle

中提供了我的情况示例

我能做什么:

  • 检索选择的值(id)。
  • 通过手动输入如下索引,从languages数组中检索/显示“selected”标签内容:

    self.chosenLang = languages[0];
    

我不能做的事情:

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

    self.chosenLang = languages[self.selectedChoice];
    

1 个答案:

答案 0 :(得分:1)

我已更新你的小提琴:http://jsfiddle.net/dWw7F/14/

我所做的是我在selectedChoice可观察对象上添加了订阅,以便我可以检测到它何时发生变化。订阅的一个方便之处是它们包含调用订阅者时发布者的值,因此函数中的参数choice

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

然后我将chosenLang提升为一个observable,以便让DOM检测到它的变化。这个改变也让我改变了html中的绑定,我不得不使用它:

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

请注意chosenLang()使用括号。这是因为我们想要直接访问observables数据而不是observable。