淘汰赛自定义绑定未更新

问题描述

请检查我在做什么错.

当我在javascript中创建控件时，我的自定义绑定处理程序的更新部分未执行.我有一个添加函数，可以在表中创建一行.绑定到自定义绑定的控件会执行更新部分，但不会执行随后添加的控件.

The update part of my custom bindinghandler does not executes when I create a control in javascript. I have an Add function that create a row in a table. Controls that are bound to the custom binding does executes the update part but not controls that are subsequently added.

HTML

<div id="collapse-programHead" class="panel-collapse collapse">
            <div class="panel-body">
                <table class="cv">
                     <thead>
                        <tr>
                            <th>Programme</th>
                            <th>Core Module Count</th>
                            <th>Core SAQA Credit</th>
                            <th>Elective Module Count</th>
                            <th>Elective SAQA Credit</th>
                            <th>Credit</th>
                        </tr>
                    </thead>
                    <tbody data-bind="foreach: ProgrammeHead">
                        <!-- ko if: isActive -->
                        <tr>
                            <td><select data-bind="options: programmes, optionsText: 'Programme', value: ProgrammeID, optionsValue:'ProgrammeID', optionsCaption:''"></select></td>
                            <td><input type="text" readonly="true" data-bind="value:ModuleCount, offeringCount:$root.programmeOfferingCount"/></td>

                            <td><input type="text"/></td>
                            <td><input type="text"/></td>
                            <td><input type="text"/></td>
                            <td><input type="text" data-bind="value: Credit"/></td>
                            <td class="tinyTD"><a class="removeRow" id="ProgrammeHead" title="Delete item" href="javascript:void(0)"></a></td>
                            <td class="hideTD"><input type="hidden" data-bind="value: CVId" /></td>
                            <td class="hideTD"><input type="hidden" data-bind="value: ProgrammeID" /></td>
                            <td class="hideTD"><input type="hidden" data-bind="value: ProgrammeOfferingID" /></td>
                            <td class="hideTD"><input type="hidden" data-bind="value: ManagementLoadID" /></td>
                        </tr>
                        <!-- /ko -->
                    </tbody>
                </table>
                <a title="Add row" id="a2" href="javascript:void(0)" data-bind="click: addRow.bind($data, 'programHead')"><label>Add row</label></a>
            </div>
        </div>

ko.bandingHandler

ko.bandingHandler

ko.bindingHandlers.offeringCount = {
        init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
            return { controlsDescendantBindings: true };
        },
        update: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
            var value = ko.unwrap(valueAccessor)
            var id = ko.unwrap(bindingContext.$data.ProgrammeID);

            var item = programmes().filter(function (i) {
                return i.ProgrammeID() == id;
            })
            if (item.length > 0) {
                var count = ko.unwrap(item[0].ProgrammeOfferingCount);
                bindingContext.$data.ModuleCount(count);
            }
        }
    };

ProgrammeHead添加

ProgrammeHead Add

self.ProgrammeHead.push({ 'ManagementLoadID': '', 'CVId': '', 'ModuleCount': count, 'ProgrammeID': '', 'ProgrammeOfferingID': '', 'Credit': '', 'isActive': active });

推荐答案

valueAccessor参数是一个返回绑定值的函数.如果绑定值是可观察值，则还必须解包"该可观察值以获取实际值.在您的代码中，您没有正确解开该值.应该是:

The valueAccessor parameter is a function that returns the bound value. If the bound value is an observable, then you must also "unwrap" the observable to get the real value. In your code, you haven't unwrapped the value properly. It should be:

var value = ko.unwrap(valueAccessor());

update函数的内容充当ko.computed的主体，因此就像计算的依赖项跟踪:

The contents of the update function act as the body of a ko.computed and so works just like the computed dependency tracking:

这篇关于淘汰赛自定义绑定未更新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！