爲一個綁定的字符串數組選擇一個字符串

Question

我已經綁定了一個簡單的字符串數組到一個列表。
敲除顯示正確。

<input data-bind="value: clicked" /> 
<ul data-bind="foreach: strArr, click: $root.selectStr"> 
    <li data-bind="text: $data"></li> 
</ul> 

當用戶點擊其中一個列表項目時，我想填充與列表項目綁定的字符串。然而，我的點擊功能所收到的對象似乎是完整的淘汰賽模式。

function StringViewModel() { 
    var self = this; 
    self.strArr = ko.observableArray(["one", "two", "three"]); 
    self.clicked = ko.observable(); 

    self.selectStr = function (str) { 
     console.log(str); 
     self.clicked(str); 
    } 
} 
ko.applyBindings(new StringViewModel()); 

這裏是一個jsFiddle

我寫我的selectStr功能，因此，它會顯示在列表項的文字怎麼辦; [「one」，「two」，「three」]中的任一個。

這感覺就像一個簡單的問題來解決，但自從我第一天淘汰賽，也許我缺少一些基本的東西。

Answer 1

您應該添加單擊處理程序li元素，而不是ul：

<input data-bind="value: clicked" /> 
<ul data-bind="foreach: strArr"> 
    <li data-bind="text: $data, click: $root.selectStr"></li> 
</ul> 

這裏是工作提琴：http://jsfiddle.net/BqGrR/1/