在剔除视图中访问$ parent的$ parent-嵌套上下文


80

为简洁起见更新

如何在嵌套的Knockout foreach中/使用绑定引用$ parents的$ parent?

范例-

    <!-- ko foreach: grandParent -->
        <tr>
            <!-- ko foreach: $parent.parents --> // <-- Doesn't work
                <!-- ko foreach: children -->
                    <td data-bind="if: favToy().name == $parent.$parent.favToy().name">
                        <span data-bind="text: favToy().name"></span>
                    </td>
                <!-- /ko -->
            <!-- /ko -->
        </tr>
    <!-- /ko -->

原版的

抱歉,这个令人困惑的问题,但是我正在尝试达到第二级父级的值,以检查当前上下文中的值(如下所示),仅在它与$ parent的$ parent的值匹配时才显示跨度(ugh!)。

    <!-- ko foreach: grandParent -->
        <tr>
            <!-- ko foreach: $parent.parents -->
                <!-- ko foreach: children -->
                    <td data-bind="if: favToy().name == $parent.$parent.favToy().name">
                        <span data-bind="text: favToy().name"></span>
                    </td>
                <!-- /ko -->
            <!-- /ko -->
        </tr>
    <!-- /ko -->

这样会更容易,但是根据我的阅读,这是不可能的,或者我做错了:)

    <!-- ko foreach: grandParent -->
        <tr>
            <!-- ko foreach: $parent.parents -->
                <!-- ko foreach: children ? favToy().name == $parent.$parent.favToy().name -->
                    <td  data-bind="text: favToy().name"></td>
                <!-- /ko -->
            <!-- /ko -->
        </tr>
    <!-- /ko -->

任何帮助将不胜感激。


我不明白您的问题,什么不起作用?您的问题是什么$parent.$parentspan因为您无法合并foreach和和,所以必须使用或的语法if
nemesv 2013年

Answers:


136

使用该$parents数组,祖父母将为$parents[1]$root如果grandParent示例中的对象是最顶层的父对象,则也可以使用。

文档

$父母

这是代表所有父视图模型的数组:

$ parents [0]是父上下文中的视图模型(即,与$ parent相同)

$ parents [1]是祖父母上下文中的视图模型

$ parents [2]是曾祖父母上下文中的视图模型

… 等等。

$ root

这是根上下文(即最顶层的父上下文)中的主要视图模型对象。通常是传递给ko.applyBindings的对象。它等效于$ parents [$ parents.length-1]。


由于某种原因$parent.$parent对我不起作用,但是此解决方案效果很好,而且更短!
PeterM


0

我认为这样使用noChildContext设置会更容易:

在不创建子上下文的情况下使用“ as”

as选项的默认行为是为当前项目添加名称,同时还将内容绑定到该项目。但是您可能希望保持上下文不变,仅设置当前项目的名称。后一种行为可能是将来版本的Knockout中的默认行为。要为特定绑定打开它,请将noChildContext选项设置为true。当将此选项与as一起使用时,对数组项的所有访问都必须通过给定名称进行,并且$ data将保持设置为外部viewmodel。例如:

<ul data-bind="foreach: { data: categories, as: 'category', noChildContext: true }">
    <li>
        <ul data-bind="foreach: { data: category.items, as: 'item', noChildContext: true }">
            <li>
                <span data-bind="text: category.name"></span>:
                <span data-bind="text: item"></span>
            </li>
        </ul>
    </li>
</ul>

在这里阅读更多

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.