Indeks dostępu $ parent w knockout.js

87

W knockout.js 2.1.0 w szablonie korzystającym z powiązania foreach można uzyskać dostęp do indeksu bieżącego elementu za pomocą funkcji $ index (). Czy w zagnieżdżonym powiązaniu foreach istnieje sposób uzyskania dostępu do indeksu elementu macierzystego $ parent z szablonu?

Powiedzmy, że mam taką strukturę danych:

var application = {
  topModel: [
    {
      {subModel: [{'foo':'foo'}, { 'bar':'bar'}]}, // this has top:0 and sub:0
      {subModel: [{'foo2':'foo2'}, { 'bar2':'bar2'}]} // this has top:0 and sub:1
    },
    {
      {subModel: [{'foo':'foo'}, { 'bar':'bar'}]} // this is top:1 sub:0
    },
    {
      {subModel: [{'foo':'foo'}, { 'bar':'bar'}]} // this is top:2 sub:0
      {subModel: [{'foo':'foo'}, { 'bar':'bar'}]} // this is top:2 sub:1
    },
    ...
    ]};

W tym celu chcę wydrukować ścieżkę do każdego modelu, używając indeksów: [topModel-index subModel-index], tak aby wynik wyglądał mniej więcej tak:

[0 0]
[0 1]
[1 0]
[2 0]
[2 1]
...

Powiązałem modele przy użyciu foreach, ale nie mogę dowiedzieć się, jak uzyskać dostęp do indeksu topModel w kontekście podModelu. Poniższy przykład pokazuje podejście, które wypróbowałem, ale nie działa, ponieważ nie mogę dowiedzieć się, jak uzyskać dostęp do indeksu strony odsyłającej $ parent.

<!--ko foreach: topModel -->
<!--ko foreach: subModel -->
  [<span data-bind="text: $parent.index()"></span>
  <span data-bind="text: $index()"></span>]
<!--/ko-->
<!--/ko-->

Należy wydrukować: 0 1, 0 2, 1 0, 1 1, 1 2, 2 0, 2 1, ...

Jørgen
źródło
Właściwie nie potrzebujesz tego ()po $indextam.
Matthew Schinckel,
Ponadto, gdybyś mógł utworzyć jsfiddle z tym, co masz, byłoby to łatwiejsze. Lub opublikuj swoje źródło danych i wyświetl kod modelu.
Matthew Schinckel
Na razie pracuję tylko nad prototypowaniem, więc nie mam wiele więcej niż podany przykład. Jestem jednak otwarty na sugestie dotyczące innych podejść.
Jørgen
Może raczej opisz, co próbujesz zrobić, niż jak . Może być inne podejście.
Matthew Schinckel
Dzięki. Zmieniłem pytanie i mam nadzieję, że teraz jest to bardziej jasne?
Jørgen

Odpowiedzi:

186

aby uzyskać dostęp do indeksu użycia obiektu nadrzędnego

$parentContext.$index()

zamiast

$parent.index()
Brett Smith
źródło
Dzięki. Właśnie spędziłem całe wieki, próbując to znaleźć!
DavidHyogo
14
Chociaż, aby być zbyt dosłownym w imię bezmózgi, nadal musisz $parentContext.$index()radzić sobie z parenami. ; ^) Trochę więcej o $ parentContext tutaj , fwiw.
ruffin
3
dzięki - zdecydowanie warte odnotowania, w kontekście wartości złożonej musiałbyś dodać (), jednak jeśli wiązałeś element z indeksem $ parentContext. $ zgodnie z pytaniem, nie potrzebujesz go.
Brett Smith
5
Potrzebne są nawiasy$parentContext.$index()
Jaider
4
Chciałem tylko dodać, że $parentContext.$parentContext.$index()działa tak, jak można się spodziewać.
Ryan Wheale,
3

Najłatwiejszym sposobem, aby się tego dowiedzieć, jest pobranie „kontekstu eliminacji” dla Chrome. To pokazuje, jakie dane są powiązane z jakim elementem, a także pozwala zobaczyć dostępne funkcje / zmienne do tego konkretnego powiązanego elementu. To niesamowite narzędzie w takich sytuacjach.

juliański
źródło