[javascript] 녹아웃보기에서 $ parent의 $ parent 액세스-중첩 컨텍스트

간결성을 위해 업데이트 됨

$ parents의 $ parent를 중첩 된 Knockout foreach / 바인딩을 사용하여 참조 할 수 있습니까?

예 –

    <!-- 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 -->

어떤 도움이라도 대단히 감사하겠습니다.



답변

$parents배열을 사용하면 조부모는 $parents[1]. 예제 $rootgrandParent객체가 최상위 부모 인 경우 에도 사용할 수 있습니다 .

로부터 문서 :

$ 부모

이것은 모든 상위 뷰 모델을 나타내는 배열입니다.

$ parents [0]은 부모 컨텍스트의 뷰 모델입니다 (즉, $ parent와 동일).

$ parents [1]은 조부모 컨텍스트의 뷰 모델입니다.

$ parents [2]는 증조부모 컨텍스트의 뷰 모델입니다.

… 등등.

$ root

이것은 루트 컨텍스트, 즉 최상위 상위 컨텍스트의 기본 뷰 모델 객체입니다. 일반적으로 ko.applyBindings에 전달 된 개체입니다. $ parents [$ parents.length-1]과 동일합니다.


답변

사용할 수 있습니다 $parentContext.$parent.

$parentContext같은 많은 유용한 특성을 제공한다 ( $data, $parent, $index, …)


답변

다음과 같이 noChildContext 설정을 사용하는 것이 더 쉬울 것이라고 생각합니다.

자식 컨텍스트를 만들지 않고 “as”사용

as 옵션의 기본 동작은 현재 항목의 이름을 추가하는 동시에 콘텐츠를 항목에 바인딩하는 것입니다. 그러나 컨텍스트를 변경하지 않고 현재 항목의 이름 만 설정하는 것을 선호 할 수 있습니다. 이 후자의 동작은 Knockout의 향후 버전에서 아마도 기본값이 될 것입니다. 특정 바인딩에 대해 켜려면 noChildContext 옵션을 true로 설정하십시오. 이 옵션을 as와 함께 사용하면 배열 항목에 대한 모든 액세스가 주어진 이름을 통해 이루어져야하며 $ data는 외부 뷰 모델로 설정된 상태로 유지됩니다. 예를 들면 :

<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>

여기에서 더 많은 것을 읽으십시오


답변