Ko.bindinghandlers在Chrome中不工作

Question

我创建了一个bindingHandler：

ko.bindingHandlers.highlight = {
        update: function (element, valueAccessor) {
            $(element).fadeTo("fast", 0.03);
            $(element).fadeTo("fast", 1);
            $(element).fadeTo("fast", 0.03);
            $(element).fadeTo("fast", 1);
            $(element).fadeTo("fast", 0.03);
            $(element).fadeTo("fast", 1);
            $(element).fadeTo("fast", 0.03);
            $(element).fadeTo("fast", 1);
        }
};

...and将其绑定到observableArray：

<div data-bind="foreach: contactsInfrastructure">
                <div class="contact" data-bind="highlight: Contact">
                    <div class="contactAvailability">
                        <div class="contactAvailabilityColor" data-bind="css: "availabilityCssClass"></div>
                    </div>
                    <div class="contactName" ><span data-bind="text: name"</span></div>
                    <!-- <div class="contactNote ellipseText" data-bind="text: group"></div> -->
                </div>
            </div>

它在Firefox中运行良好，但在Chrome中返回此错误:未登录的ReferenceError：

Unable to parse bindings.
Bindings value: highlight: Contact
Message: Contact is not defined

起初，我认为这是由于DOM没有准备好而造成的，但事实并非如此。

Answer 1

Contact应该是contactsInfrastructure数组的一个元素吗？因为，如果是这样，您应该使用<div class="contact" data-bind="highlight: $data">代替。

Answer 2

当您使用没有任何引号的contact时，Knockout将搜索一个名称为Contact的可观察到的。然而，在您的ViewModel中没有这样的可观察到的。

似乎您也没有在您的自定义处理程序中使用这个词。如果您需要将这个单词作为文本传递给您的处理程序，您可以将它封装在引号=> 'Contact‘中。

<div class="contact" data-bind="highlight: 'Contact'"> 
OR
<div class="contact" data-bind="highlight: true">

Answer 3

在html中绑定时，实体名称必须在camelcase中。