Magento2 : While bind Custom knockout js to html it return only default value

Question

/app/design/frontend/Vendor/custom_theme/Magento_CheckoutAgreements/templates/additional_agreements.phtml

I have this code inside .phtml:

<div data-bind="scope: 'checkout-agreements-component-scope'" class="checkout-agreements-block">
    <!-- ko template: getTemplate() --><!-- /ko -->
</div>
<script type="text/x-magento-init">
    {
        "*": {
            "Magento_Ui/js/core/app": {
                "components": {
                    "checkout-agreements-component-scope": {
                        "component": "Magento_CheckoutAgreements/js/view/checkout-agreements",
                        "agreements": <?php /* @noEscape */ echo $agreementJson; ?>,
                        "isVisible": true,
                        "exampleMessage": "<?php echo 'Hello Magento Stack Exchange!'; ?>",
                        "sarfaraj": "<?php echo 'I am Back....!' ?>"
                    }
                }
            }
        }
    }
</script>

/app/design/frontend/Vendor/custom_theme/Magento_CheckoutAgreements/web/js/view/checkout-agreements.js

inside .js:

return Component.extend({
            defaults: {
                exampleMessage: 'Default Text Ready',
                sarfaraj: 'Raj',
                template: 'Magento_CheckoutAgreements/checkout/checkout-agreements'
            },              

            initialize: function() {
                this._super();
                console.log(this.exampleMessage);
                this.message = ko.observable(this.exampleMessage);
                console.log(this.sarfaraj);
                this.FIR = ko.observable(this.sarfaraj);
            }
    });

/app/design/frontend/Vendor/custom_theme/Magento_CheckoutAgreements/web/template/checkout/checkout-agreements.html

inside .html:

<h2 data-bind="text: message"></h2>
<h3 data-bind="text: FIR"></h3>

My OUTPUT at Checkout page:

Help Me. Thanks.

Answer 1

@sarfaraj this actually helps in above situation.

How to pass a Magento 2 variable to KnockoutJS