Question

  ko.bindingHandlers.below = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {

      var valuex = valueAccessor(), allBindings = allBindingsAccessor();

      var th = $(element).closest('tbody').prev('thead').find('> tr > th').eq(index);
      if (th.attr("class") == valuex) {
        $(element).innerHTML = viewModel.value;
      }
    }
  };

选择器在自定义绑定中不起作用。

我也尝试过$（element）.parent（）并返回相同的元素。为什么呢？

See fiddle here

Answer 1

.innerHTML是一个javascript本机函数，不适用于jQuery。请尝试使用.html（）。

$（元素）的.html（viewModel.value）;

Answer 2

在看到你的小提琴后，我尝试了一个不涉及jQuery的解决方案，使用Knockout将该Javascript对象映射到HTML表。

http://jsfiddle.net/EfrainReyes/r6Vke/1/

HTML：

<table>
<thead>
    <tr>
        <th>Caracteristicas</th>
        <!-- ko foreach: planNames -->
        <th data-bind="text: $data"></th>
        <!-- /ko -->
    </tr>
</thead>
<tbody data-bind="foreach: caracteristicas">
    <tr>
        <td data-bind="text: $data"></td>
        <!-- ko foreach: { data: $root.rows($data) } -->
        <td data-bind="text: $data ? $data : '...'">

        </td>
        <!-- /ko -->
    </tr>
</tbody>
</table>

JS：

viewModel.planNames = ko.computed(function () {
    return ko.utils.arrayMap(this.plans(), function (plan) {
        return plan.PlanName();
    });
}, viewModel);

viewModel.caracteristicas = ko.computed(function () {
    var descripciones = ko.utils.arrayMap(this.plans(), function (plan) {
        return ko.utils.arrayMap(plan.Caracteristicas(), function (carac) {
            return carac.Descripcion();
        });
    });

    return ko.utils.arrayGetDistinctValues(descripciones.reduce(function (x,y) {
        return x.concat(y);
    }));
}, viewModel);

viewModel.rows = function(caracteristica) {
    var cars = ko.utils.arrayMap(this.plans(), function (plan) {
        var valor = null;

        var car = ko.utils.arrayFirst(plan.Caracteristicas(), function(carac) {
            return carac.Descripcion() === caracteristica;
        });

        if (car && car.Valor) {
            valor = car.Valor();
        }

        return valor;
    });
    return cars;
};

ko.applyBindings(viewModel);

Knockout - Jquery选择器在Custom Binding中不起作用

2 个答案: