Question

我知道我可以检查USDteUnk()的值，然后硬编码ViewModel.USDte（＆＃34;＆＃34;）来清除值。

但是，我想知道，当元素不可见时，是否有一种明智的方法来清除值？即，当Unsure [USDteUnk]选中时，请清除[USDte]？

<div class="form-group">
  <label for="USDte">4.1 Date of first scan?</label>
  <div id="USDteBox" data-bind="visible: USDteUnk() === '0' || USDteUnk() === ''">
    <input type="text" name="USDte" id="USDte" class="form-control" placeholder="dd/mm/yyyy" data-bind="value: USDte">
  </div>
  <div class="btn-group" data-toggle="buttons">
    <label class="btn btn-blue">
      <input type="checkbox" class="form-control" name="USDteUnk" id="USDteUnk" data-bind="bsChecked: USDteUnk"> Unsure
    </label>
  </div>
</div>

以下是处理程序bsChecked，因为我使用bootstrap按钮组，原始的Checked处理程序不起作用。

ko.bindingHandlers.bsChecked = {
            init: function (element, valueAccessor, allBindingsAccessor,
            viewModel, bindingContext) {
                var value = valueAccessor();
                if (ko.unwrap(value)==='-1')
                    $(element).closest('.btn').button('toggle');

                var newValueAccessor = function () {
                    return {
                        change: function () {
                            value(element.checked?'-1':'');
                        }
                    }
                };
                ko.bindingHandlers.event.init(element, newValueAccessor,
                allBindingsAccessor, viewModel, bindingContext);
            },
            update: function (element, valueAccessor, allBindingsAccessor,
            viewModel, bindingContext) {
                if ($(element).val() == ko.unwrap(valueAccessor()) && !$(element).prop('checked')) {
                    $(element).closest('.btn').button('toggle');
                }
            }
        }

基于的@Tomalak答案

            ko.applyBindings(VM);
            VM.OtherDetail().USDteUnk.subscribe(function (newValue) {
                if (newValue === '-1') {
                    VM.OtherDetail().USDte('');
                }
            });

Answer 1

有一种聪明的方法可以在元素不可见时清除值吗？即，当Unsure [USDteUnk]选中时，清除[USDte]？

是的，通过subscription。

self.USDteUnk.subscribe(function (checked) {
    if (checked) self.USDte("");
});

显示USDte值的元素是否可见是完全不相关的。

Knockout JS - 在不可见时清除价值的任何聪明方法？

1 个答案: