淘汰賽$數據綁定到HTML元素

因此，假設我有這樣的視圖模型命名爲人它由一個數組人對象文本的，像

[{ name = John, age = 30, sex = male }, 
{ name = Mike, age = 29, sex = male }, 
{ name = Anna, age = 28, sex = female }]

再假設我想數據綁定每個人的<li>，像

<ul data-bind="foreach: people"> 
    <li data-bind="text: name"></li> 
</ul>

但，是有可能的，也許通過data-bind="with: $data"，將整個人的對象綁定到<li>，例如，當我點擊<li>時，其他一些<div>會顯示其餘的信息，在本例中這些信息是年齡和性別？

這就像我想<li>來保存人物數據，所以我可以在別的地方使用它。

來源

2014-01-14 fduayer

一般情況下，你想創建這樣一個selectedPerson觀察到在視圖模型水平，那麼你可以這樣做：

<ul data-bind="foreach: people"> 
    <li data-bind="click: $parent.selectedPerson"> 
     <span data-bind="text: name"></span> 
     <div data-bind="visible: $parent.selectedPerson() === $data"> 
       <span data-bind="text: age"></span> 
     </div> 
    </li> 
</ul>

你當然可以使用周圍的名稱的鏈接/按鈕，如果你喜歡。當你點擊它時，selectedPerson將用作處理程序，並將當前數據作爲第一個參數傳遞。因爲，selectedPerson實際上是可觀察的，所以它將填充數據作爲它的值。

否則，你當然可以有另一個區域，以顯示在您做的詳細信息：

<div data-bind="with: selectedPerson"> 
    .... 
</div>

快速小提琴：http://jsfiddle.net/rniemeyer/8dRZ4/

來源

2014-01-14 21:42:03

淘汰賽$數據綁定到HTML元素

回答

相關問題