마 젠토 2 새로운 그리드 시스템 템플릿


15

가맹점 베타 1.0.0 버전에서 Magento의 새로운 백엔드 그리드 시스템을 둘러 보았습니다.
우선 감동한다고 말해야합니다.
이제 표시 할 열을 선택하고 순서를 변경할 수 있으며 반드시 열이없는 속성으로 필터링 할 수 있습니다.
그러나 그것은 중요하지 않습니다.
그리드가 어떻게 렌더링되는지 이해하지 못합니다.
템플릿 경로 힌트를 사용하면 제품 그리드가 템플릿 app/code/Magento/Ui/view/base/ui_component/templates/listing/default.xhtml과 블록을 통해 렌더링되는 것을 볼 수 Magento\Ui\Component\Listing있었습니다.
템플릿을 편집하고 이해할 수없는 것을 보았습니다.

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

이 줄을 제거하고 활성화 된 경우 캐시를 지우면 더 이상 그리드가 표시되지 않습니다.
누군가 이것이 무엇 ko이고 어떻게 작동하는지 설명 할 수 있습니까 ?
다른 템플릿에서도 이런 종류의 마크 업을 찾을 수 있습니다. app/code/Magento/Ui/view/base/web/templates/grid/controls/columns.html예를 들어.

[업데이트]
방금 ko이것을 참조 하는 간단한 검색 (duh!)으로 알았습니다 . http://knockoutjs.com/ 그래도 설명이 필요합니다.

답변:


7

마 젠토 2가 사용하는 것처럼 보입니다. 모델과 뷰를 연결하기 위해 HTML 데이터 바인딩 (및 경우에 따라 HTML 주석)을 사용하는 MVVM 프레임 워크 인 Knockout.js 를 사용하는 것 같습니다.

여기서이 주석은 가상 요소입니다. "템플릿"은 아마도 Magento의 사용자 정의 바인딩 일 것입니다 (참조 : http://knockoutjs.com/documentation/custom-bindings-for-virtual-elements.html ) 인 getTemplate()JavaScript 함수입니다. 실제 요소를 렌더링합니다.

녹아웃을 이해하려면 knockoutjs.com의 대화식 자습서를 살펴보십시오. 이해하기 쉽고 튜토리얼 / 문서가 정말 좋습니다.


1
감사. 이것은 좋은 시작입니다. 다시
— Marius

녹아웃을 사용한 지
— 오래되었지만

1
추세는 phtml을 덜 사용하고 html을 더 많이 사용하는 것입니다. 둘 다 볼 수 있지만 phtml은 템플릿에 있고 ko 관련 항목은 웹에 있습니다. 차이점은 phtml이 블록에 바인딩되어 있고 html에 구성 제공자와 js 모델보기가 있다는 것입니다. Checkout을 살펴보면, 많은 예제가 있습니다
— PartySoft
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.