0

我有一个来自 REST API 的 JSON 数组。我正在使用 Knockout 映射插件来处理数组并将 JSON 加载到预设的表单值中（如果用户之前已将值添加到表单中 - 我有数据来测试 Knockout 数组）。该表单本质上是添加或删除带有输入的 div 块，因此用户可以添加/删除“工作”体验。

我的麻烦是试图破译插件如何映射数组。我试图在数组中找到一行的特定值（id），以便我可以将其添加为变量来告诉 API 删除该特定行。我可以让 Knockout 显式输出 html 中的行值，但我不知道如何捕获它。在模板“foreach”中，我有一个引用“删除：”的按钮，这就是我试图从数组中捕获值的地方。

例如在 HTML 中：

这输出两行“工作”对象没问题：

<span data-bind="text: ko.mapping.toJSON(workModel.work())"></span>

[{"id":"1","schoolID":"2","place":"","position":"Science Teacher","description":"I worked at ASD for 1 year as a Science teacher.","start":"2011","end":"2012","profileID":"91"},{"id":"2","schoolID":"1","place":"American School of Taiwan","position":"Science Guy","description":"I was just another science guy","start":"2008","end":"2011","profileID":"91"}]

这将输出数组中第一行和项目的 id：

<span data-bind="text: ko.mapping.toJSON(workModel.work()[0].id)"></span>
"1"

但是在 javascript 中，如果您单击由 foreach 模板生成的删除按钮...

gone = function(work) {

        alert(ko.mapping.toJSON(workModel.work(this).id)); 

     }

在 Firebug 中给了我这个错误，然后 UI 重新加载并删除了我刚刚单击的模板块。

Unable to parse bindings. Message: TypeError: workModel.work()[0] is undefined; Bindings value: text: ko.mapping.toJSON(workModel.work()[0].id)

即使，如果我用显式语句替换上述警报：

gone = function(work) {

         alert(ko.mapping.toJSON(workModel.work()[0].id)); 

         }

我再次得到正确的“1”值。我知道它与代码的“this”方面有关，但我不确定映射插件在做什么，以便我可以从数组中捕获特定值......有意义吗？任何帮助将不胜感激。

4

2 回答 2

0

我终于明白了。它来自 Stack Overflow 和 Knockout 论坛上的不同帖子的组合。我相信其他人有比这更优雅的解决方案，但它对我有用。

在“删除”（或您要用于捕获值的任何按钮）按钮上的 foreach 循环中，我在数据绑定中包含以下内容：

<a href="" class="btn" data-bind="click: function() { remove($data.id()); }">Remove</a>

然后在javascript中我有：

var self = this;
var row_id;

self.remove = function(index){
            var row_id = index;
            alert(row_id);

    }

警报根据我的需要返回已加载 JSON 的行 ID。$data.id() 可以更改/用于从加载的 JSON 返回任何映射元素。row_id 是一个全局变量，也可以在其他地方访问。

于 2012-08-02T06:07:30.363 回答
0

我要在这里四处走动，但我确实认为这是这个问题，是的。Javascript 中的作用域有时会很麻烦。尝试在包含消失函数的范围内做这样的事情：

var self = this;
gone = function(work) {
    alert(ko.mapping.toJSON(workModel.work(self).id)); 
}

免责声明：我现在无法自己测试，但试一试:)

于 2012-07-31T08:18:39.920 回答