你如何在Knockout中观察JavaScript哈希表？ [英] How do you observe JavaScript hashtables in Knockout?

问题描述

在我的Knockout视图模型中，我有一些属性，我正在尝试创建一个可观察的哈希值。因此，而不是我的前Knockout代码

In my Knockout viewmodel, I've got some properties where I'm trying to make a hash observable. So instead of my pre-Knockout code of

self.MyHash = {};

我现在正在使用：

self.MyHash = ko.observable({});

在我的代码的其他部分，我用这样的语句操作哈希：

In other parts of my code, I am manipulating the hash with statements like these:

// add an entry
self.MyHash()["test"] = "My Value";

// remove an entry
delete self.MyHash()["test"];

代码有效，因为条目已正确添加和删除。但是，哈希表的更改似乎没有被观察它的代码区域检测到。例如，当我更改哈希表时，这个计算的observable永远不会运行：

The code works, in that the entries are added and removed properly. However, the changes to the hashtable don't seem to be detected by areas of the code that are observing it. For example, this computed observable never runs when I am changing the hashtable:

self.Querystring = ko.computed(function ()
{
    var f = [];
    $.each(self.MyHash(), function (k, v)
    {
        f.push(encodeURIComponent(k) + '=' + encodeURIComponent(v));
    });

    return (f.length > 0) ? f.join("&") : "";
});

我猜这是因为Knockout observables必须是简单变量（或observableArrays）并且它没有检测到我的哈希表的底层更改。

I am going to guess that this is because Knockout observables are required to be simple variables (or observableArrays), and that it's not detecting the underlying changes to my hashtable.

如果是这样，还有其他选择吗？为什么在Knockout中没有observableHash类型？

If so, are there other options? Why isn't there an observableHash type in Knockout?

对于它的价值，我的解决方法是使用observableArray键和常规JavaScript哈希表来查找值。然后我改变了我的计算方法来观察键数组而不是之前的其他哈希表变量。我只是想确保我没有错过在Knockout中执行此操作的正确方法。

For what it's worth, my workaround is to have an observableArray of keys, and a regular JavaScript hashtable to lookup the values. Then I changed my computed method to observe the array of keys rather than the other hashtable variable I had before. I just want to make sure I'm not missing "The Right Way" to do it in Knockout.

self.MyHashKeys = ko.observableArray();
self.MyHash = {};

self.Querystring = ko.computed(function ()
{
    var f = [];
    $.each(self.MyHashKeys(), function (index, value)
    {
        f.push(encodeURIComponent(value) + '=' + encodeURIComponent(self.MyHash[value]));
    });

    return (f.length > 0) ? f.join("&") : "";
});

推荐答案

请参阅可观察数组页面。只需创建一组键/值对：

See the second example on the observable array page. Just make an array of key/value pairs:

// This observable array initially contains three objects
var anotherObservableArray = ko.observableArray([
    { name: "Bungle", type: "Bear" },
    { name: "George", type: "Hippo" },
    { name: "Zippy", type: "Unknown" }
]);

在您的示例中，您只是迭代（删除除外），因此没有必要使用一本真正的字典。只搜索密钥就很容易了。我认为地图的使用在某种程度上是一种不成熟的优化。它也不完全符合查询字符串多次支持相同密钥的能力。

In your examples you are only iterating (except for deletion), so there is no real need to use an actual dictionary. It would be easy enough to just search for the key. I think the use of map is kind of a premature optimization to some extent. Its also not entirely in line with the ability of query strings to support the same key multiple times.

编辑：如果你想观察在此示例中键或值更改，您还必须使这些属性可观察：

if you want to observe the key or value changing in this example, you would also have to make those properties observable:

var anotherObservableArray = ko.observableArray([
    { name: ko.observable("Bungle"), type: ko.observable("Bear") }
]);

这篇关于你如何在Knockout中观察JavaScript哈希表？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！