Question

我刚刚开始使用Knockout.Js并且努力实现我认为基本的东西。最令人讨厌的是尝试在可观察数组中计算字符串的唯一实例并打印到ui。

具体来说，我有一个酒店模型，每个酒店都有一个'hotelType'字段。这将是'B＆amp; B'，或'全包'等。我已设法获得显示为复选框的这些酒店类型的唯一列表，并将它们绑定回observableArray。然后使用此数组过滤显示的酒店列表。然而，我不能做的是提供阵列中每个类别类型的计数（即50家酒店，40家B＆amp; B's等）。

我遇到的唯一方法是使用Compute构建新字段，并使用arrayFilter获取已过滤数组的长度。这会非常昂贵而且很麻烦。

有更简单的方法吗？

Answer 1

根据您的描述，我建议采用不同的方法。我建议将hotelType从字符串升级到应用程序的适当部分。例如，您可以将其设置为位于hotel和$root（或酒店列表）之间的ViewModel。从本质上讲，您的酒店列表将成为基于hotelType的分组列表。

以下JSON建议我正在谈论的结构：

var data = {
    allHotels : [{
          hotelType : "B&B",
          hotels : [{name: "West Inn", chosen: false}, 
                    {name: "East Inn", chosen: true}]
        },{
          hotelType : "All-inclusive",
          hotels : [{name: "North Inn", chosen: false}, 
                    {name: "Center Inn", chosen: false}, 
                    {name: "South Inn", chosen: false}]
    }]};

这样可以很容易地计算每种类型的酒店数量。在您的视图中会出现类似的情况：

<ul data-bind="foreach: allHotels">
    <li>
        <span data-bind="text: hotelType"></span>
        (<span data-bind="text: hotels().length"></span>)
        ...foreach: hotels here...
    </li>
</ul>

请查看this jsfiddle，了解我的建议。

酒店总数也很简单：hotelTypes所有总数的总和。总计会在需要时更新：如果某个项目已从相关集合中删除/添加。

使用Knockout.js计算Array中的实例

1 个答案: