KnockoutJS - 选中复选框与未选中复选框时如何重新分配 URL答案

【问题标题】：KnockoutJS - How to reassign URL when checkbox is checked vs. uncheckedKnockoutJS - 选中复选框与未选中复选框时如何重新分配 URL
【发布时间】：2016-01-23 00:59:59
【问题描述】：

我想在每次选中复选框时在函数中分配一个 URL。但我也希望在取消选中复选框时重新分配 URL 的初始值。我能够从以下thread 创建下面的代码，但是当我取消选中该框时，不会重新分配 URL。抱歉，我是 KnockoutJS 和 JavaScript 的新手。

HTML

   <input type="checkbox" name="myCheckBox" data-bind="checked:isChecked, click: setUrl">Search Supplier<br>

  searchShippingCodesUrl = '/Parteners/Search';
...
...
ischecked: ko.observable(false),
        setUrl: function () {
                searchShippingCodesUrl = '/Suppliers/Search';
                return true;            
        },

感谢您的宝贵时间。

【问题讨论】：

选中或取消选中时会触发 click 事件，并且您的 setUrl 函数不会对 isChecked 进行任何检查以确定 url 应该是什么

标签： asp.net checkbox knockout.js asp.net-mvc-5

【解决方案1】：

如果您需要区分复选框是通过单击更改状态还是通过内部设置更改状态，请仅在复选框上使用click 绑定。 checked 绑定为您捕获视图的状态，因此您可以在视图模型中使用它。要在它发生变化时采取行动，你 subscribe 到 observable（我在这里借用 dfperry 的示例中的变量）：

ischecked.subscribe(function (newValue) {
    searchShippingCodesUrl = newValue ? supplierSearch : partnerSearch;
});

【讨论】：

【解决方案2】：

您需要在 setUrl 函数中检查 isChecked 以获得切换效果：

var partnerSearch = '/Partners/Search',
    supplierSearch = '/Suppliers/Search';

searchShippingCodesUrl = partnerSearch;

...

ischecked: ko.observable(false),
setUrl: function () {

  searchShippingCodesUrl = (ischecked() ? supplierSearch : partnerSearch);
  return true;            
}

【讨论】：