knockout.js - 尝试创建绑定处理程序将绑定应用于后代

Question

我正在尝试制作一个基于传递的内容创建模块的处理程序。这是我所拥有的：

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);

我无法弄清楚如何访问小部件中的属性。例如，在“测试”功能中，“this”总是指窗户……但我需要能够到达场地。如何从内部访问 Widget 中的其他属性？

Answer 1

这可能不是一个正确的答案，但它似乎正在工作：

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(),
            kendoGrid: {
                data: this.test,
                sortable: true,
                scrollable: true,
                columns: ['Name', 'Time','Event'],
                height: '100%'
            }
        },
        _templates: {
            main: '<div style="height:100%"></div>',
            simple: '<div data-bind="kendoGrid: kendoGrid"></div>'
        },
        _create: function () {
            var that = this;
            that.options.kendoGrid.data = that.test();
            that.update();
            that.element.append(that._templates.simple);
        },
        test: function () {
                var that = this;
                return ko.computed(function () {
                    return that.options.venues().length > 0 ? that.options.venues() : {};
                });
            },
        update: function () {  ...  }
        });

Answer 2

ko.computedthis接受第二个参数，这是您在运行计算的 observable 时想要的值。

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