web-dev-qa-db-fra.com

Accédez à $ parent en tant que parent dans la vue knockout - contexte d'imbrication

Mise à jour par souci de brièveté

Comment puis-je référencer le parent de $ parents dans Knockout imbriqué foreach/with bindings?

Exemple -

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

Désolé pour la question déroutante, mais j'essaie d'atteindre la valeur d'un parent de second niveau pour la comparer à une valeur du contexte actuel (comme ci-dessous) afin d'afficher une étendue uniquement si elle correspond à la valeur du parent de $ 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 -->

Ce serait plus facile de le faire de cette façon, mais d'après ce que j'ai lu, ce n'est pas possible ou je le fais 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 -->

Toute aide serait grandement appréciée.

javascriptknockout.js
74
PW Kad

Utilisez le $parents tableau, le grand-parent serait $parents[1]. Vous pourrez peut-être aussi utiliser $root si l'objet grandParent de votre exemple est le parent le plus élevé.

De la docs :

$ parents

C'est un tableau représentant tous les modèles de vue parent:

$ parents [0] est le modèle de vue du contexte parent (c'est-à-dire identique à $ parent).

$ parents [1] est le modèle de vue du contexte des grands-parents

$ parents [2] est le modèle de vue issu du contexte des arrière-grands-parents

… etc.

$ root

Il s’agit de l’objet principal de modèle de vue dans le contexte racine, c’est-à-dire le contexte parent le plus élevé. Il s’agit généralement de l’objet transmis à ko.applyBindings. Cela équivaut à $ parents [$ parents.length - 1].

128
Matt Burland

Vous pouvez utiliser $parentContext.$parent.

$parentContext fournit de nombreuses propriétés utiles telles que ($data, $parent, $index, ...)

7
Hassan Alhaj

Je pense qu'il serait plus facile d'utiliser le paramètre noChildContext comme ceci:

Utiliser "en tant que" sans créer de contexte enfant

Le comportement par défaut de l'option as consiste à ajouter un nom à l'élément en cours tout en liant le contenu à l'élément. Mais vous préférerez peut-être que le contexte reste inchangé et définissez uniquement le nom de l'élément en cours. Ce dernier comportement sera probablement le comportement par défaut dans une future version de Knockout. Pour l'activer pour une liaison spécifique, définissez l'option noChildContext sur true. Lorsque cette option est utilisée avec as, tous les accès aux éléments du tableau doivent se faire via le nom donné et $ data restera défini sur le modèle de vue externe. Par exemple:

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

Lire la suite ici

0
cjohansson