你如何观察 Knockout 中的 JavaScript 哈希表

How do you observe JavaScript hashtables in Knockout?

本文关键字：Knockout 中的 JavaScript 哈希表 观察 何观察      更新时间：2023-09-26

在我的 Knockout 视图模型中，我有一些属性，我试图使哈希可观察。所以而不是我的淘汰前代码

self.MyHash = {};

我现在使用：

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

在我的代码的其他部分，我使用如下语句操作哈希：

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

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

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 可观察量需要是简单的变量（或可观察数组），并且它没有检测到我的哈希表的潜在更改。

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

对于它的价值，我的解决方法是有一个可观察的键数组，以及一个常规的JavaScript哈希表来查找值。然后我更改了我的计算方法来观察键数组，而不是我之前拥有的其他哈希表变量。我只是想确保我不会错过在淘汰赛中做到这一点的"正确方式"。

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("&") : "";
});

请参阅可观察数组页面上的第二个示例。 只需创建一个键/值对数组：

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

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

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

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