Magento 2新的网格系统模板


15

我一直在Merchant beta 1.0.0版本上浏览新的Magento后端网格系统。
首先,我必须说我印象深刻。
现在,您可以选择要查看的列,可以对其进行重新排序,还可以根据不一定具有列的属性进行过滤。
但这并不重要。
我不了解网格的渲染方式。
通过启用模板路径提示,我看到例如产品网格是通过模板app/code/Magento/Ui/view/base/ui_component/templates/listing/default.xhtml和via块呈现的Magento\Ui\Component\Listing
我编辑了模板,看到了一些我不理解的东西。

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

如果删除此行(并清除缓存,如果启用的话),我将不再有网格。
有人可以解释这ko是什么以及它如何工作吗?
我还在其他模板中找到了这种标记。 app/code/Magento/Ui/view/base/web/templates/grid/controls/columns.html例如。

[更新]
我刚刚找到了一个简单的搜索(duh!),它ko指向以下内容:http : //knockoutjs.com/,但我仍然需要一些说明。

Answers:


7

看起来Magento 2正在使用Knockout.js,这是一个MVVM框架,该框架使用HTML数据绑定(在某些情况下为HTML注释,例如您发现的注释)来链接模型和视图。

在这里,此注释是一个虚拟元素,“模板”可能是Magento的自定义绑定(请参阅:http : //knockoutjs.com/documentation/custom-bindings-for-virtual-elements.html),getTemplate()显然是一个JavaScript函数,它是负责渲染真实元素。

要了解淘汰赛,请访问它们在twinoutjs.com上的交互式教程,我发现它很容易掌握,并且教程/文档非常棒。


1
谢谢。这是一个好的开始。我会就这个给您回复:)
马吕斯

它已经有一段时间,因为我用的淘汰赛,但我在Magento 2 :)爱多么简单和干净是,期待利用它再次
费边Schmengler

1
趋势是较少使用phtml,更多使用html,两者都在视图中,但phtml在模板中,而与ko相关的东西在Web中。区别在于phtml绑定到了一个块,而html具有配置提供程序和js模型视图。看一下Checkout,它有很多示例
PartySoft,2015年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.