Question

我想基于条件对表列使用其他绑定处理程序，例如：

<tbody data-bind="foreach: plansList">
    <tr>
        <td data-bind="numVotes > 0 ? (html: voteOptionLinked) : (text: voteOption)"></td>

在一种情况下，有一个我想使用html处理程序绑定的链接，但在另一种情况下，我只想使用text处理程序来显示链接。上面的方法不起作用，因为handler:必须位于data-bind属性的开头，但是有什么办法可以在淘汰赛中做到这一点？

Answer 1

一种解决方法，但是可以实现您想要的：

<tr>
    <!-- ko if: numVotes() > 0 -->
        <td data-bind="html: voteOptionLinked"></td>
    <!-- /ko -->
    <!-- ko ifnot: numVotes() > 0 -->
        <td data-bind="text: voteOption"></td>
    <!-- /ko -->
</tr>

Answer 2

您可以使用自定义绑定：

ko.bindingHandlers.customBinder = {
    init: function(element, valueAccessor, allBindings) {
        
    },
    update: function(element, valueAccessor, allBindings, viewModel) {
        var numVotes = valueAccessor();
        if (numVotes() > 0){
          var html = viewModel.voteOptionLinked;
          element.innerHTML = html;
        }
        else {
          var text = viewModel.voteOption;
          element.textContent = text;
        }
    } 
};

// ----------------------------------------------------------------------------
// Page viewmodel



function SurveyViewModel() {
    this.numVotes = ko.observable(4);
    this.voteOptionLinked = '<span>ab</span><span>dfsdf</span>';
    this.voteOption = 'zzzzzz';
}

ko.applyBindings(new SurveyViewModel());

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<div data-bind="customBinder:numVotes">

</div>

如何根据条件更改绑定处理程序？

2 个答案: