Magento 2 knockout js dynamic button title in minicart

Question

I'm trying to add dynamic checkout button title in minicart using knockout js. Button title will be configured in admin configs. I configured in minicart.js But I dont know how to use/call in template file. Below is my code,

Magento2\vendor\xxxx\yyyyy\view\frontend\web\js\minicart.js

 return Component.extend({
            shoppingCartUrl: window.checkout.shoppingCartUrl,
            maxItemsToDisplay: window.checkout.maxItemsToDisplay,
            checkoutNowUrl: window.checkout.shoppingCartUrl+'?checkoutnow=1',
            proceedToCheckoutUrl: window.checkout.checkoutUrl,
            checkoutNowTitle: window.checkoutConfig.payment.ccform.checkoutnowTitle,
            cart: {},

Magento2\vendor\xxxx\yyy\view\frontend\web\template\minicart\content.html

<button 
                        id="checkout-now"
                        type="button"
                        class="action primary checkout"
                        data-action="close"
                        data-bind="attr: {href: checkoutNowUrl}"
                        translate="data-bind='attr: {href: checkoutNowTitle}'"
                />

The checkoutNowUrl is rendering properly. The title is rendered from translate="data-bind='attr: {href: checkoutNowTitle}'"; I tried with all possibilities, but nothing is working. Any help will be appreciated

Answer 1

Try to use the title attribute and the text data-binding, like this:

<button 
    id="checkout-now"
    type="button"
    class="action primary checkout"
    data-action="close"
    data-bind="attr: {href: checkoutNowUrl, title: checkoutNowTitle}, text: checkoutNowTitle"
/>

Here is example from the Magento_Authorizenet module:

app/code/Magento/Authorizenet/view/frontend/web/template/payment/authorizenet-directpost.html

<button data-role="review-save"
    type="submit"
    data-bind="
    attr: {title: $t('Place Order')},
    enable: (getCode() == isChecked()),
    click: placeOrder,
    css: {disabled: !isPlaceOrderActionAllowed()}
    "
    class="action primary checkout"
    disabled>
    <span data-bind="i18n: 'Place Order'"></span>
</button>