Der Kürze halber aktualisiert
Wie kann ich auf die $ Eltern $ Eltern in verschachtelten Knockout foreach / mit Bindungen verweisen?
Beispiel -
<!-- 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
Entschuldigen Sie die verwirrende Frage, aber ich versuche, den Wert eines Elternteils der zweiten Ebene zu erreichen, um ihn mit einem Wert im aktuellen Kontext (wie unten) zu vergleichen und nur dann eine Spanne anzuzeigen, wenn er mit dem Wert eines $ Elternteils $ Eltern übereinstimmt (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 -->
Es wäre einfacher, es so zu machen, aber nach dem, was ich gelesen habe, ist dies nicht möglich oder ich mache es falsch :)
<!-- 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 -->
Jede Hilfe wäre sehr dankbar.
javascript
knockout.js
PW Kad
quelle
quelle
$parent.$parent
oder die Sie verwenden müssen,span
weil Sie dasforeach
und das nicht zusammenführen könnenif
?Antworten:
Verwenden Sie das
$parents
Array, wäre der Großelternteil$parents[1]
. Möglicherweise können Sie auch verwenden,$root
wenn dasgrandParent
Objekt in Ihrem Beispiel das oberste übergeordnete Objekt ist.Aus den Dokumenten :
quelle
$parent.$parent
hat es bei mir nicht funktioniert, diese Lösung hat jedoch gut funktioniert und ist auch kürzer!Sie können verwenden
$parentContext.$parent
.$parentContext
bieten viele nützliche Eigenschaften wie ($data
,$parent
,$index
, ...)quelle
Ich denke, es wäre einfacher, die Einstellung noChildContext wie folgt zu verwenden:
<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>
Lesen Sie hier mehr
quelle