来自二维数组的 KnockoutJS foreach 循环答案

【问题标题】：KnockoutJS foreach loop from 2-dimensional array来自二维数组的 KnockoutJS foreach 循环
【发布时间】：2012-03-22 19:59:27
【问题描述】：

我有一个从服务器返回的 JSON 字符串，我尝试使用 KnockoutJS 绑定到 foreach 循环

返回的 JSON 如下所示：

    [{"FileID":19,
"ParentID":6,
"SubType":"Page",
"FileName":"nav_secondary_bg.png",
"FileExtension":null,"Filetype":"20",
"FileMethod":null,"FileGroupName":null,
"FileLocation":"/uploads/Page/resized/nav_secondary_bg.png_thumb",
"FilenameOriginal":"nav_secondary_bg.png",
"AltTag":null,
"DateUploaded":"\/Date(-62135596800000+0000)\/",
"OrigFilesize":0,
"OrigFile":null,
"SiteID":0,
"Display":"y",
"FileDefault":false},
{... Next Item...}]

还有我的html代码：

<div id="itemImages" >
     <ul data-bind="foreach: Image">       
        <li>        
        <span data-bind="value: FileName"></span>
        </li>        
        </ul>
    </div>     
</div>

我尝试按照教程 (http://learn.knockoutjs.com/#/?tutorial=loadingsaving) 上的示例进行操作，但它无法让映射插件正确映射数据并让 forloop 完全正常工作。

更新：

使用 johns 示例，我现在将数据绑定到 UI，但是在收到新数据后难以更新绑定。

【问题讨论】：

标签： arrays foreach mapping knockout.js

【解决方案1】：

这是一个可以与你的比较的工作小提琴：

http://jsfiddle.net/jearles/y4b9e/

确保您对 span 使用 text 绑定，而不是值绑定。 value 绑定用于将属性绑定到表单元素（input、select、...），而 text 绑定将设置关联 DOM 元素（p、span、...）的 innerText 或 textContext

【讨论】：

太完美了！发现我的代码几乎相同，但是页面上的多个绑定导致了问题。
好的，这很好，但是我似乎无法在创建绑定后更新绑定，我再次从服务器获取 JSON 字符串，但绑定永远不会更新 UI
你也可以这样写更新行：jsfiddle.net/jearles/y4b9e/5
终于重新审视这个，一切都很好，但我将如何更新代码中的绑定而不是单击按钮？我有一段 js 代码将数据发送回服务器，一旦完成更新绑定？
我只是将按钮用作回调方法的触发器。您可以使用任何您想要的作为触发器。这是一个设置 3 秒计时器回调的更新：jsfiddle.net/jearles/y4b9e/13