当父母相互排斥时，淘汰赛验证孩子

Question

这就是我的设想：

我有东西。每个项目都有一个无线电选项列表。选项在项目之间是相同的。当选择无线电选项时，我需要检查它是否有效。我是通过检查互斥项没有选择相同的选项来做到这一点的。

例如：

项目A-基金1-基金2-无基金

项目B-基金1-基金2-无基金

项目C-基金1-基金2-无基金

让我们假设项目A和B是相互排斥的。因此，基金1可以在A项上选择，但不能在B项上选择。如果发生这种情况，则A项和B项无效。但是，基金1可以选择A和C或B和C。

我该怎么用淘汰赛来做这个呢？构造它的最佳方法是什么？

我有一个项目列表，每个项目都有一个带有“Selected”属性的无线电选项列表。我订阅了所选的属性，其思想是更新父属性( item )上的一个标志，以指示是否可以选择该项。当任何子属性更改时，都需要对所有父属性执行此操作。从孩子那里更新父母似乎不是个好主意。有什么想法/建议吗？

Answer 1

因此，基本的问题是，Item A和Item B不能有相同的值，与我所理解的Item C有点无关，因为它总是有效的。

在对两个单选按钮列表进行选择时，可以使用computed来确定相等性。由于您还没有提供示例代码，所以我创建了一个演示来说明：

JS Fiddle演示

HTML:

<p>Item A: 
   <span class="error" data-bind="visible: !isValidA()">Invalid Selection</span>
</p>
<div data-bind="foreach: optionValues">
    <input type="radio" name="optionsGroup1" 
           data-bind="attr: {value: value}, 
                      checked: $root.selectionA" /> 
    <span data-bind="text: label"></span>
</div>

<p>Item B: 
   <span class="error" data-bind="visible: !isValidB()">Invalid Selection</span>
</p>
<div data-bind="foreach: optionValues">
    <input type="radio" name="optionsGroup2" 
           data-bind="attr: {value: value}, 
                      checked: $root.selectionB" /> 
    <span data-bind="text: label"></span>
</div>

<p>Item C: 
   <span class="error" data-bind="visible: !isValidC()">Invalid Selection</span>
</p>
<div data-bind="foreach: optionValues">
    <input type="radio" name="optionsGroup3" 
           data-bind="attr: {value: value}, 
                      checked: $root.selectionC" /> 
    <span data-bind="text: label"></span>
</div>

ViewModel:

var viewModel = {
    optionValues: [{
        "value": "1",
            "label": "Fund 1"
    }, {
        "value": "2",
            "label": "Fund 2"
    }, {
        "value": "0",
            "label": "No Fund"
    }],
    selectionA: ko.observable("0"),
    selectionB: ko.observable("0"),
    selectionB: ko.observable("0"),
    isValidA: ko.computed = function () {
        return (this.selectionA() !== this.selectionB())
            || (this.selectionA() === "0");
    },
    isValidB: ko.computed = function () {
        return (this.selectionA() !== this.selectionB()) 
            || (this.selectionB() === "0");
    },
    isValidC: ko.computed = function () {
        return true;
    }
};
ko.applyBindings(viewModel);

每次单选按钮更改时，计算都会重新计算，因此它可以评估选择是否有效，并且您可以根据它的结果执行其他逻辑，在这种情况下，我只是用结果控制可见性或错误标签。

所有项目都初始化为No Fund，如果Item A和Item B有相同的选择No Fund，那么它目前不会导致错误。若要使其导致错误，只需删除计算中的比较的第二部分，如下所示：

isValidA: ko.computed = function () {
    return this.selectionA() !== this.selectionB();
}