3

I have been checking out M2's frontend structure and I stumbled in some knockoutjs's template binding, for example in Magento/Checkout/view/frontend/web/template/shipping-address/form.html(this file render the add new address popup form in Shipping page of checkout), we got:

<form class="form form-shipping-address" id="co-shipping-form" data-bind="attr: {'data-hasrequired': $t('* Required Fields')}">
<!-- ko foreach: getRegion('before-fields') -->
<!-- ko template: getTemplate() --><!-- /ko -->
<!--/ko-->
<div id="shipping-new-address-form" class="fieldset address">
    <!-- ko foreach: getRegion('additional-fieldsets') -->
    <!-- ko template: getTemplate() --><!-- /ko -->
    <!--/ko-->
    <!-- ko if: (isCustomerLoggedIn) -->
    <div class="field choice" data-bind="visible: !isFormInline">
        <input type="checkbox" class="checkbox" id="shipping-save-in-address-book" data-bind="checked: saveInAddressBook" />
        <label class="label" for="shipping-save-in-address-book">
            <span data-bind="i18n: 'Save in address book'"></span>
        </label>
    </div>
    <!-- /ko -->
</div>

I understand the checkbox part, but not the <!-- ko template: getTemplate() --><!-- /ko -->. I tried deleting one of those and the popup is empty. What is getTemplate() exactly and where can I find the piece of code that it references to?

1

Hi Joel!

Regarding the following statement:

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

This is utilizing Knockout's template binding functionality to render the template specified by the JavaScript component's getTemplate() directive.

The getTemplate() directive is defined in Magento's uiElement JavaScript module (mapped via RequireJS to Magento_Ui/js/lib/core/element/element).

--

Here are some helpful links:

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.