I want to bind customer scope to a non-html element as I do not want html to be loaded if customer is not logged in. In the OOTB magento inside vendor/magento/module-theme/view/frontend/templates/html/header.phtml li tag is loaded even if customer is not logged in. Visually the li is hidden in this case but the accessibility screen reader reads it.

I want to bind a scope to a non-html element so that I can write a condition something like below.

<!-- ko scope: customer -->
        <!-- ko if: customer().fullname  -->
        <li class="greet welcome">
            <span class="logged-in"
                  data-bind="text: new String('<?= $block->escapeHtml(__('Welcome, %1!', '%1')) ?>').replace('%1', customer().fullname)">
        <!-- /ko -->
    <!-- /ko -->

But scope is not bound.

knockout.js:3381 Uncaught ReferenceError: Unable to process binding "if: function(){return customer().firstname }"
Message: customer is not defined.

Any other way to achieve this?

1 Answer 1


For scope you should use a String. Try:

<!-- ko scope: 'customer' -->
  • That did the trick! Thank you so much @JanuszJanczy :)
    – Sejal Shah
    Commented Oct 10, 2020 at 13:59
  • Thanks for this, do you happen to have a link to the knockout/magento documentation for this? I have been googling for a while and I can't find anything but this question and answer
    – Meberem
    Commented Jul 10, 2021 at 18:45

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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