I have been developing a module for Magento2 Checkout that fills some information, not important what, this data resides in Magento's db, and I am able to access it via Magento database access layer.

My question is, how do I get this retrieve this data and use it in a Knockoutjs UI Component in Checkout?

  • Are you going to use it with existing component or new? May 1 '17 at 3:34
  • I am extending uiComponent into a new ui component May 1 '17 at 11:42

I was able to get this working by implementing a ConfigProvider via implementing ConfigProviderInterface.


namespace My\Plugin\Model;

class MyPluginConfigProvider implements ConfigProviderInterface
    protected $scopeConfig;

    public function __construct(
        ScopeConfigInterface $scopeConfig
    ) {
        $this->scopeConfig = $scopeConfig;

    public function getConfig()
        $config = [
            'store_address' => [
                'name' => $this->scopeConfig->getValue('general/store_information/name'),
                'city' => $this->scopeConfig->getValue('shipping/origin/city'),
        return $config;

Added it to app/code/My/Plugin/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">
            <argument name="configProviders" xsi:type="array">
                <item name="instore_config_provider" xsi:type="object">Premiergroup\InStoreShipping\Model\InStoreConfigProvider</item>

And then, finally, called it from within my ko uiComponent:

function (
) {
    'use strict';
    return Component.extend({

    functionToBind: function () {
        var storeName = window.checkoutConfig.store_address.store_name;
        // do something with the storeName

I hope someone else finds this helpful and I can't find any documentation on this!


In the phtml file where you get the Value from db write below code:

.phtml file code:

    window.myData = "<?php echo $datafromdb ?>";

in Knockout js you can access this data like:

        //your model
    function (url) {
        'use strict';

        return {
            mydata: window.myData,
  • Hi, since I am using UI components, it uses Knockout html templates, so there is no phtml. May 1 '17 at 11:44
  • Than you can refer this html file /vendor/magento/module-checkout/view/frontend/web/template/billing-address/details.html method: currentBillingAddress() May 1 '17 at 11:55
  • That file doesn't really have anything to do with getting data from the database, just filling it in with a template. I found a way to do it via ConfigProviderInterface. May 1 '17 at 17:30

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.