Zaktualizowano dla zwięzłości
Jak mogę odwołać się do rodzica $ rodziców $ w zagnieżdżonych powiązaniach Knockout foreach / with?
Przykład -
<!-- 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 -->
Oryginalny
Przepraszam za mylące pytanie, ale próbuję dotrzeć do wartości rodzica drugiego poziomu, aby sprawdzić wartość w bieżącym kontekście (jak poniżej), aby pokazać zakres tylko wtedy, gdy pasuje do wartości rodzica $ rodzica (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 -->
Byłoby łatwiej to zrobić w ten sposób, ale z tego, co przeczytałem, nie jest to możliwe lub robię to źle :)
<!-- 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 -->
Każda pomoc byłaby bardzo mile widziana.
javascript
knockout.js
PW Kad
źródło
źródło
$parent.$parent
lub której musisz użyć,span
ponieważ nie możesz scalićforeach
iif
?Odpowiedzi:
Użyj
$parents
tablicy, tak będzie dziadek$parents[1]
. Możesz także użyć,$root
jeśligrandParent
obiekt w twoim przykładzie jest najwyższym rodzicem.Z dokumentów :
źródło
$parent.$parent
nie działało u mnie, to rozwiązanie jednak działało dobrze i jest też krótsze!Możesz użyć
$parentContext.$parent
.$parentContext
dostarczają wielu użytecznych właściwości, takie jak ($data
,$parent
,$index
, ...)źródło
Myślę, że łatwiej byłoby użyć ustawienia noChildContext w następujący sposób:
<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>
Przeczytaj więcej tutaj
źródło