Question

我在页面上有一条消息，指示用户至少选择五个项目。一旦用户选择了五个项目，我希望该消息消失。

<span class="message" data-bind="text: messageToChooseAtLeastFiveItems, disable: hasSelectedFiveItems"></span>

在ViewModel中，我最初将值设置为false，当用户选择五个项目时，值会更改为true。

self.hasSelectedFiveItems = ko.observable(false);

gridUnredeemed.onSelectedRowsChanged.subscribe(function (e) {
    var hasFiveRecalc = gridUnredeemed.getSelectedRows().length >= 5;

    self.hasSelectedFiveItems(hasFiveRecalc);
});

为什么跨度内的文字仍然出现？

的jsfiddle

http://jsfiddle.net/jkittell/x5xjncyp/

Answer 1

你应该这样做

查看：

<select multiple="true" data-bind="options:array,selectedOptions:selected"></select>
<span class="message" data-bind="text: messageToChooseAtLeastFiveItems, visible: hasSelectedFiveItems"></span>
<button data-bind="click: chooseFive">Choose Five Now</button>
<button data-bind="click: chooseLessThanFive">Choose Less Than Five</button>

<强>视图模型：

function ViewModel() {
    var self=this;
    self.array=ko.observableArray([1,2,3,4,5,6,7]);
    self.selected=ko.observableArray();
    self.messageToChooseAtLeastFiveItems = "Choose Five Foo";
    self.hasSelectedFiveItems = ko.observable(true);
    self.chooseFive = function () {
        self.hasSelectedFiveItems(false);
    }
    self.chooseLessThanFive = function () {
        self.hasSelectedFiveItems(true);
    }
    self.selected.subscribe(function(data){
        console.log(data.length);
        if(data.length >=5) { self.hasSelectedFiveItems(false);}
        else
        { self.hasSelectedFiveItems(true);}
    });

}

ko.applyBindings(new ViewModel());

使用DropDown和按钮 here

的工作示例

示例 here 只使用按钮

使用计算机（以毫米为单位进行修改）我们可以最好地检查 here 这个特殊情况。

如何在淘汰赛中禁用或禁用文本

1 个答案: