Actualizado por brevedad
¿Cómo puedo hacer referencia al $ parent de $ parent en el foreach / anidado de Knockout con enlaces?
Ejemplo -
<!-- 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 -->
Original
Perdón por la pregunta confusa, pero estoy tratando de alcanzar el valor de un padre de segundo nivel para compararlo con un valor en el contexto actual (como a continuación) para mostrar solo un intervalo si coincide con el valor de $ parent's $ parent (¡uf!)
<!-- 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 -->
Sería más fácil hacerlo de esta manera, pero por lo que he leído, esto no es posible o lo estoy haciendo mal :)
<!-- 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 -->
Cualquier ayuda será muy apreciada.
javascript
knockout.js
PW Kad
fuente
fuente
$parent.$parent
o la que debe usarspan
porque no puede fusionar elforeach
y elif
?Respuestas:
Usa la
$parents
matriz, el abuelo sería$parents[1]
. También puede usar$root
si elgrandParent
objeto en su ejemplo es el padre superior.De los documentos :
fuente
$parent.$parent
no funcionó para mí, sin embargo, esta solución funcionó bien, ¡y también es más corta!Puede utilizar
$parentContext.$parent
.$parentContext
proporcionar muchas propiedades útiles, tales como ($data
,$parent
,$index
, ...)fuente
Creo que sería más fácil usar la configuración noChildContext de esta manera:
<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>
Leer más aquí
fuente