Question

I’m trying to make a handler that creates modules based on whats passed. Here’s what I have:

ko.bindingHandlers.CreateModule = {
        init: function (element, valueAccessor, allBindingAccessor, viewModel, bindingContext) {
            var value = ko.utils.unwrapObservable(valueAccessor()),
                childContext;

            var module = $(element).kendoCustom();
            //var module = $(element)['kendo' + value]();

            childContext = bindingContext.createChildContext(module.data('kendoCustom').options);

            ko.applyBindingsToDescendants(childContext, element);
            return { controlsDescendantBindings: true };
        }
    };

var Custom = Widget.extend({
            init: function (element, options) {
                Widget.fn.init.call(this, element, options);
                this._create();
            },
            options: {
                name: 'Custom',
                isSimple: true,
                venues: ko.observableArray(),
                test: ko.computed(function () {
                    // Heres on of the main issues
                    return this.venues().length > 0 ? this.venues() : {};
                }),
                kendoGrid: {
                    data: this.test,
                    sortable: true,
                    scrollable: true,
                    columns: ['Name', 'Time','Event'],
                    height: '100%'
                },
                update: function () {  ...  }
            },
            _templates: {
                main: '<div style="height:100%"></div>',
                simple: '<div data-bind="kendoGrid: kendoGrid"></div>'
            },
            _create: function () {
                var that = this;
                that.options.update();
                that.element.append(that._templates.simple);
            }
        });

        ui.plugin(Custom);

I’m having trouble figuring out how to access the properties within the widget. For example within the ‘test’ function ‘this’ always refers to the Window…but I need to be able to get to venues. How do I access the other properties within the Widget from inside?

Answer 1

ko.computed takes a second parameter, which is the value you want for this when running the computed observable.

_create: function () {
    this.options.kendoGrid.data = ko.computed(function () {
        return this.venues().length > 0 ? this.venues() : {};
    }, this.options);
    ...
},