Posted on

call function inside ko.bindingHandlers knockoutjs

I’m trying to call a custom function inside the initialize ko.bindingHandlers function but getting the below issue.

Message: Cannot read properties of undefined (reading ‘tConvert’)

My code for reference.

define(
[
‘ko’,
‘uiComponent’,
‘underscore’,
‘Magento_Checkout/js/model/step-navigator’,
‘Magento_Customer/js/model/customer’,
“jquery”,
“mage/calendar”
],
function (
ko,
Component,
_,
stepNavigator,
customer,
$
) {
‘use strict’;

return Component.extend({
defaults: {
template: ‘BS_Checkout/delivery-date’
},

stepCode: ‘delivery’,
//step title value
stepTitle: ‘Delivery’,

/**
*
* @returns {*}
*/
initialize: function () {
this._super();

ko.bindingHandlers.deliveryslot = {
init: function (element, valueAccessor, allBindingsAccessor) {

let slot = JSON.parse(window.checkoutConfig.delivery_time_slot);
let i = 0;
for (let key in slot) {

slot[key].from = this.tConvert(slot[key].from.join(“:”))
slot[key].to = slot[key].to.join(“:”)
}

}
}
// register your step
stepNavigator.registerStep(
this.stepCode,
//step alias
null,
this.stepTitle,
//observable property with logic when display step or hide step
this.isVisible,

_.bind(this.navigate, this),
1
);

return this;
},
tConvert: function (time) {
// Check correct time format and split into components
time = time.toString ().match (/^([01]d|2[0-3])(:)([0-5]d)(:[0-5]d)?$/) || [time];

if (time.length > 1) {
time = time.slice (1);
time[5] = +time[0] < 12 ? ‘AM’ : ‘PM’;
time[0] = +time[0] % 12 || 12;
}
return time.join (”);
},
navigate: function () {

},

/**
* @returns void
*/
navigateToNextStep: function () {
stepNavigator.next();
}
});
}
);

I’m trying to call tConvert inside ko.bindingHandlers.deliveryslot.

Leave a Reply

Your email address will not be published.