Knockout自定义绑定处理程序:valueAccessor不是函数

时间:2017-11-15 15:53:51

标签: javascript knockout.js

我正在尝试使用我为文本输入字段编写的自定义绑定处理程序,该字段上有输入掩码。但是,当我尝试使用它时,我的控制台出现错误:

Public Sub TestMe() Dim str As String Dim cnt As Long str = "ABC$3$FG$H" For cnt = LBound(Split(str, "$")) To UBound(Split(str, "$")) Debug.Print Split(str, "$")(cnt) Next cnt End Sub

这是我的绑定处理程序:

Uncaught TypeError: valueAccessor(...) is not a function
    at HTMLInputElement.<anonymous> (knockout.bindings.ts:11)
    at HTMLInputElement.dispatch (jquery.js:5206)
    at HTMLInputElement.elemData.handle (jquery.js:5014)
    at Object.trigger (jquery.js:8201)
    at Object.simulate (jquery.js:8260)
    at HTMLDocument.handler (jquery.js:8319)

我的网页模型(删除了不相关的字段):

import ko from 'knockout';
import $ from 'jquery';
import Inputmask from 'inputmask';
import moment from 'moment';

ko.bindingHandlers.dateInputMask = {
    init: function (element, valueAccessor, allBindings) {
        $(element).on('focusout change', function () {
            console.log(allBindings);
            if (element.inputmask.isComplete()) {
                let time = moment(element.value, 'DD-MM-YYYY HH:mm');
                valueAccessor()(time); //error thrown from this line
            } else {
                valueAccessor()(null);
            }
        });

        Inputmask('date').mask(element);
    },
    update: function (element, valueAccessor) {
        let value = ko.utils.unwrapObservable(valueAccessor());
        let text = moment(value).format('DD-MM-YYYY HH:mm');
        element.value = text;
    }
}

HTML:

import ko from 'knockout';
import moment from 'moment';

export class EventModel {
    startDate: KnockoutObservable<moment.Moment>;
    endDate: KnockoutObservable<moment.Moment>;

    constructor(params: any) {
        this.startDate = ko.observable<moment.Moment>(moment());
        this.endDate = ko.observable<moment.Moment>(params.endDate || moment());
    }
}

<div class="form-group row"> <label class="col-lg-3 col-form-label">Startdatum</label> <div class="col-lg-8"> <input class="form-control date" data-bind="dateInputMask: startDate" /> </div> </div> 行放置断点以查看init的值时控制台的屏幕: valueAccessor

在HTML中呈现模型的json的屏幕截图(我在上面的模型代码中删除了一些字段): json 任何帮助将不胜感激。据我所知,这些错误通常意味着传递的valueAccessor不是一个可观察的,但我认为这不是这种情况。

0 个答案:

没有答案