Get Custom Parameters in Custom knockout Js at Checkout Page

If you are using knockout js at checkout page to implement some functionality, and in js file you want to access some calculated data/values from your module/other files, then you can do this by following process:

Firstly you have to define it in di.xml file at path:

app/code/Webkul/Hello/etc/frontend/di.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <type name="Magento\Checkout\Model\CompositeConfigProvider">
        <arguments>
            <argument name="configProviders" xsi:type="array">
                <item name="webkul_hello_configprovider" xsi:type="object">Webkul\Hello\Model\HelloConfigProvider</item>
            </argument>
        </arguments>
    </type>
</config>

Here, attribute name of item tag is the name for the config provider, which is unique.

value passed in item tag is the class name in which you define your variables.

Now, create file which is defined in di.xml to define your variables, which is at path:

Webkul/Hello/Model/HelloConfigProvider.php

<?php

namespace Webkul\Hello\Model;

use Magento\Checkout\Model\ConfigProviderInterface;

class HelloConfigProvider implements ConfigProviderInterface
{
    public function getConfig()
    {
        $config = [];
        $config['text'] = "Hello it is working";
        return $config;
    }
}

Here, getConfig() is a method, which is called by the ConfigProviderInterface to get values.

$config is an array, in which you can add values according to your need.

Now, use following code in js file to get the values:

/*browser:true*/
/*global define*/
define(
    [
        'ko'
    ],
    function (ko) {
        'use strict';
        var configValues = window.checkoutConfig;
        console.log(configValues.test);//here test is the field name which you passed in $config variable
    }
);

Here, in configValues variable it returns all the values which are passed in checkout config provider.

Now, i just print the value of test field (which is defined by me in model file).

And it gives, following result:

I hope this blog will help you with Get Custom Parameters in Custom knockout JS at Checkout Page. You may also check our wide range of best Magento 2 Extensions.

Please reach out to our team via a support ticket if you have any queries.

Try this and if you have any queries then just comment below 🙂

Thank you.