Hi,
I got a review comment that it is dangerous to use index binding in html. So instead of data-bind="click:$parents[0].buynow"(in my case will refer to view model's object) I'm using data-bind="click:$root.buynow" but with this it is not able to call buynow function which is in my view model. To make sure this is not working I tried simple text binding through a span tag as below. This is also not working.
view Model:
define(['ojs/ojcore', 'knockout', 'jquery', 'ojs/ojknockout', 'ojs/ojlistview', 'ojs/ojpagingcontrol', 'ojs/ojdatacollection-common', 'ojs/ojbutton'],
function (oj, ko, $)
{
function layoutViewModel(context)
{
var self = this;
self.test= ko.observable('root');
self.buynow = function (data) {
return new Promise(function () {
console.log(data);
});
};
}
return layoutViewModel;
});
View:
<div name="buttonenclosure"class="oj-flex oj-sm-justify-content-center">
<button name="actionbutton" class="button-color" data-bind="
attr: {id:actionIdTag},
click: $root.buynow,
ojComponent:
{ component: 'ojButton',
label: 'ADD TO CART',
chroming:'half'}"
style ="font-weight:400;font-family:'Segoe UI'"
>
</button>
</div>
<span data-bind="text:$root.test"></span>
Can someone please help me with this.