Question

J'ai fouillé dans le nouveau système de grille backend de Magento sur la version Merchant beta 1.0.0.
Tout d'abord, je dois dire que je suis impressionné.
Vous pouvez désormais sélectionner les colonnes à afficher, les réorganiser, filtrer par attributs qui n'ont pas nécessairement de colonne.
Mais ce n'est pas important.
Je ne comprends pas comment la grille est rendue.
En activant les indications de chemin du modèle, j'ai vu que la grille des produits par exemple est rendue via le modèle app/code/Magento/Ui/view/base/ui_component/templates/listing/default.xhtml et via le bloc Magento\Ui\Component\Listing.
J'ai modifié le modèle et j'ai vu quelque chose que je ne comprends pas.

<!-- ko template: getTemplate() --><!-- /ko -->

Si je supprime cette ligne (et vide le cache si activé), je n'obtiens plus de grille.
Quelqu'un peut-il expliquer ce que c'est ko c'est et comment ça marche ?.
Je retrouve également ce type de balisage dans d'autres modèles. app/code/Magento/Ui/view/base/web/templates/grid/controls/columns.html Par exemple.

[MISE À JOUR]
Je viens de découvrir avec une simple recherche (duh !) que ko fait référence à ceci : http://knockoutjs.com/ mais j'ai encore besoin de quelques explications.

Était-ce utile?

La solution

Il semble que Magento 2 utilise Knockout.js, un framework MVVM qui utilise des liaisons de données HTML (et dans certains cas des commentaires HTML, comme celui que vous avez trouvé) pour lier le modèle et la vue.

Ici, ce commentaire est un élément virtuel, "template" probablement une liaison personnalisée de Magento (voir : http://knockoutjs.com/documentation/custom-bindings-for-virtual-elements.html), getTemplate() évidemment une fonction JavaScript qui est chargée de restituer le ou les éléments réels.

Pour comprendre knockout, parcourez leur tutoriel interactif sur knockoutjs.com, je l'ai trouvé facile à comprendre et le tutoriel/documentation est vraiment génial.

Licencié sous: CC-BY-SA avec attribution
Non affilié à magento.stackexchange
scroll top