Question

knockout website告诉我们如何从该元素的自定义绑定中访问特定元素的所有绑定。

但是我想要获取应用特定命名绑定的所有元素的列表。这可能通过淘汰赛方法吗？

例如，我想向knockout询问我的页面上使用可见绑定的所有元素的列表。

Answer 1

有趣的问题！

我要到这里说你需要自己做DOM traversal。没有Knockout工具可以完全满足您的需求。即使这样，你也必须深入了解KO。这是基于一些经验，以及仔细查看KO TypeScript definition（这可能是对KO导出功能的近乎完整的概述）。

在定义中查看the relevant bit，您可以像这样使用KnockoutBindingProvider：

＆＃13;

var vm = {
  submodel: {
    name: ko.observable('apple'),
    description: ko.observable('fruit')
  },
  elementsWithTextBindings: ko.observable('')
};

vm.refresh = function() {
  var result = "";
  var all = document.getElementsByTagName("*");
  
  for (var i=0, max=all.length; i < max; i++) {
    var ctx = ko.contextFor(all[i]);
    
    if (ko.bindingProvider['instance'].nodeHasBindings(all[i])
        && !!ko.bindingProvider['instance'].getBindings(all[i], ctx).text) {
      var bindings = ko.bindingProvider['instance'].getBindingsString(all[i], ctx);
      result += "Elem with id=" + all[i].id + " has `text` binding ('" + bindings + "').\n";
    }
  }
  vm.elementsWithTextBindings(result);
};

ko.applyBindings(vm);

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<div id="a" data-bind="with: submodel">
  <p id="b" data-bind="text: name, style: { color: 'red' }"></p>
  <p id="c" data-bind="text: description"></p>
  <input id="d" data-bind="value: name" />
</div>
All elements with `text` bindings:
<button id="e" data-bind="click: refresh">refresh!</button>
<pre id="f" data-bind="text: elementsWithTextBindings"></pre>

＆＃13;

这利用了您可以从外部到达ko.bindingProvider的事实。这似乎是by design，因为源将其导出：

ko.exportSymbol('bindingProvider', ko.bindingProvider);

在我的代码中，我还使用nodeHasBindings，getBindings和getBindingsString。后者有a comment：

// The following function is only used internally by this default provider.
// It's not part of the interface definition for a general binding provider.

所以我假设前两个方法是公共接口的一部分，因此可以安全地用于您的目的。 getBindingsString对于您的目的来说并不是真正必要的，但我仅仅为了示例而将其包含在示例中。

如何获取使用特定敲除绑定的所有元素的列表？

1 个答案: