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

【问题标题】：How do change binding handler based on a condition?如何根据条件更改绑定处理程序？
【发布时间】：2019-01-05 22:27:38
【问题描述】：

我想根据条件为表列使用不同的绑定处理程序，例如：

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

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

【问题讨论】：

标签： javascript html data-binding knockout.js

【解决方案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>

【讨论】：

【解决方案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>

【讨论】：