javascript - KnockoutJS foreach 嵌套数组的单个元素

Question

我正在进行一个项目，试图为给定的查询呈现搜索过滤器方面，但规则是这样的，我不能简单地使用嵌套 ko: foreach语句，因为不同的结果集有不同的显示规则。

我正在映射的对象如下所示:

FacetResults: ko.observableArray([
{
   Term: 'myTerm',
   Values: [{'key1': 5}, {'key2': 13}]
},
{  Term: 'myTerm2',
   Values: [{'key3': 6}, {'key4': 42}]
}]);

基本上，我想要完成的事情是这样的

<!-- ko foreach: FacetResults()[0] -->
   <span data-bind="text: Term"></span>
   <ul data-bind="foreach: Values">
    <!-- do something -->
   </ul>
<!-- /ko -->

但是我无法在不出现“无法解析绑定(bind)”错误的情况下执行此操作。

我能够做类似的事情

<span data-bind="text: FacetResults[0]"></span>

并返回“Object object”，但是一旦我这样做了 <span data-bind="text: FacetResults[0[].Term" </span> , 我遇到了同样的绑定(bind)损坏错误。

我曾考虑过将结果集分解为多个 observableArray 以避免这种情况，但这是一个不需要特殊表示逻辑的用例，我可以在其中使用嵌套 ko: foreach循环，因此如果可能的话，我想坚持使用一个数组(特别是考虑到返回的数据类型始终相同，这样当它们从调用返回时我就不用解析它们了)。

就其值(value)而言，我还可以在运行时检查对象，并通过 console.log(vm.FacetResults()[0].Term) 断言 FacetResults[0].Term 是有效字段;没有问题。

任何帮助将不胜感激。谢谢!

Answer 1

我相信您正在寻找 with绑定(bind)。

The with binding creates a new binding context, so that descendant elements are bound in the context of a specified object.

这应该适合你

<!-- ko with: FacetResults()[0] -->
   <span data-bind="text: Term"></span>
   <ul data-bind="foreach: Values">
    <!-- do something -->
   </ul>
<!-- /ko -->