淘汰赛追逐绑定事件

knockout chaning binding events

本文关键字：事件 绑定 追逐 淘汰赛      更新时间：2023-09-26

目前我无法触发依赖于淘汰赛中另一个绑定事件结果的绑定事件。

在下面的示例中，在"可用"输入中

提供一个值，当"condition1"输入填充了诸如 22 的值时，应清除并禁用"可用"输入，所有这些都在跳过逻辑绑定中完成。这正在正常发生。

但是，问题在于在 chain1 输入元素上执行 skiplogic 绑定。在清除"可用"输入的值后，这甚至不会被触发。我怎样才能得到它，以便一个绑定的结果触发另一个绑定？

以下是代码的js小提琴版本：http://jsfiddle.net/gYNb8/2/

这是我用来测试概念的形式：

<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<span>Condition 1</span> 
<input id="condition1" data-bind="value: condition1" />
<br/>
<span>Condition 2</span> 
<input id="condition2" data-bind="value: condition2" />
<br/>
<span>Available?</span> 
<input id="available" data-bind="value: available, skipLogic: condition1, skipLogic: condition2" />
<br/>
<span>Chain1</span> 
<input id="chain1" data-bind="value: chain1, skiplogic: available" />

这是javascript：

此屏幕的整体视图模型以及初始状态 函数 ReservationsViewModel（） { var self = this;

    self.condition1 = ko.observable();
    self.condition2 = ko.observable();
    self.available = ko.observable();
    self.chain1 = ko.observable();
}
//Here are the conditions which govern whether an element should be enabled or not
var elementConditions = {
    'available': [{
        'Condition': 'condition1() > 0',
        'Type': 'evaluation'
    }, {
        'Condition': 'condition2() > 0',
        'Type': 'evaluation'
    }],
        'chain1': [{
        'Condition': 'available',
        'Type': 'empty'
    }]
};

ko.bindingHandlers.skipLogic = {
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) {

        var id = $(element).attr("id");
        var conditions = elementConditions[id];
        var isSkipped = false;
        var conditionMet = false;
        for (var i = 0; i < conditions.length; i++) {
            conditionMet = false;
            if (conditions[i].Type == "evaluation") {
                conditionMet = eval('viewModel.' + conditions[i].Condition);
            } else if (conditions[i].Type == "empty") {
                if ($('#' + conditions[i].Condition).val().length == 0) {
                    conditionMet = true;
                }
            } else if (conditions[i].Type == "notempty") {
                if ($('#' + conditions[i].Condition).val().length > 0) {
                    conditionMet = true;
                }
            }
            if (conditionMet == true) {
                isSkipped = true;
            }
        }
        if (isSkipped) {
            eval("viewModel." + id + "('');");            
            $(element).attr("disabled", "disabled");
        } else {
            if (elementSkipped[id] > 0) {
                $(element).attr("disabled", "disabled");
            } else {
                $(element).removeAttr("disabled");
            }
        }
    }
};
ko.applyBindings(new ReservationsViewModel());

与其尝试单独保留条件，不如使用布尔逻辑在绑定中将它们串在一起？ 这样，就不需要跟踪每个绑定状态。我构建了以下绑定：

ko.bindingHandlers.skipLogic = {
init: function(element, valueAccessor) {
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
    var valueOfCondition = ko.unwrap(valueAccessor());
    var jqElement = $(element);       
//update if the field is disabled if more than one condition is met        
        if(valueOfCondition){
            jqElement.prop('disabled', true);
        }
        else{
            jqElement.prop('disabled', false);
        }
     }
};

这里有一个工作的例子：http://jsfiddle.net/M7vUV/3/

绑定

的update函数将在元素首次绑定时执行（在init函数之后），然后在其任何依赖项更改时再次运行。 通过访问函数中的可观察量来创建依赖项（例如计算对象内部，因为计算实际上用于促进绑定更新）。

因此，您需要确保通过调用 valueAccessor() 来检索传递给绑定的任何内容，然后如果该值是可观察的，则您希望将其作为函数调用以检索该值。 否则，如果您不确定是否已传递可观察量，则可以调用ko.unwrap（在 2.3 之前，这是ko.utils.unwrapObservable - 可以使用 2.3 后

）。

此外，还可以通过使用 allBindingsAccessor 参数（第 3 个参数）或直接从数据（第 4 个参数）或上下文（第 5 个参数）访问值来访问传递给其他绑定的值。

传递具有同一元素的相同名称的多个绑定是行不通的。 您可能需要考虑以不同的方式构建它，例如data-bind="skipLogic: [one, two]"传递数组，然后访问每个数组的值。

相关文章：