How to get notified when a Knockout template is rendered using the «afterRender» binding?

dmitry_fedyuk · August 9, 2016, 2:14pm

Implementation

magento/magento2/blob/2.1.0/app/code/Magento/Ui/view/base/web/js/lib/knockout/bindings/after-render.js#L11-L25


ko.bindingHandlers.afterRender = {


    /**
     * Binding init callback.
     */
    init: function (element, valueAccessor, allBindings, viewModel) {
        var callback = valueAccessor();


        if (typeof callback === 'function') {
            callback.call(viewModel, element, viewModel);
        }
    }
};


renderer.addAttribute('afterRender');

A usage example

github.com

magento/magento2/blob/2.1.0/app/code/Magento/ConfigurableProduct/view/adminhtml/web/template/components/file-uploader.html#L20-L23


<input type="file"
       class="file-uploader-input"
       afterRender="onElementRender"
       attr="id: uid, name: fileInputName, multiple: isMultipleFiles"/>

github.com

magento/magento2/blob/2.1.0/app/code/Magento/Ui/view/base/web/js/form/element/file-uploader.js#L342-L350


/**
 * Handler function which is supposed to be invoked when
 * file input element has been rendered.
 *
 * @param {HTMLInputElement} fileInput
 */
onElementRender: function (fileInput) {
    this.initUploader(fileInput);
},

Maxim · January 25, 2018, 8:15pm

do you know how to add to the existing element, input?

dmitry_fedyuk · January 25, 2018, 8:26pm

Of course.
You can get my knowledge by ordering my support service.