Question

我使用knockout来构建一个可以绑定到Values的Visualization Application。问题是，有时我绑定到一个路径（“aa.bb.cc.dd”），其中一个孩子可能是未定义的（cc =未定义）。那么，不应该发生绑定，应该忽略它！

如果我将它嵌套在几个div中并使用绑定，这可能会有效，但所有这些都是在后面的代码中完成的，我不喜欢有这么多嵌套div的想法！还有其他解决方案吗？

Answer 1

我可以想到三个选择：

（1）通过嵌套绑定处理可空字段（如上所述）

value1 = t2 == null ? "NULL" : "INT"

（2）构建一个遍历树的计算机，并在需要时返回null

<!-- ko if: aa() -->
<!-- ko if: aa().bb() -->
<!-- ko if: aa().bb().cc() -->
<input data-bind="value: aa().bb().cc().dd"></input>
<!-- /ko -->
<!-- /ko -->
<!-- /ko -->

（3）创建一个检查未定义值的自定义绑定。我从来没有创建过自定义绑定处理程序，所以也许其他人可以协助格式，但我认为它有这个：

thing.bindableDD = ko.pureComputed(function () {
    if (thing.aa()) {
        if (thing.aa().bb()) {
            if (thing.aa().bb().cc()) {
               return thing.aa().bb().cc().dd;
            } else return null;
        } else return null;
    } else return null;
};

<input data-bind="value: bindableDD"></input>

Answer 2

您可以使用eval函数遍历路径。如果此路径不存在，则只返回null并且knockout将不会呈现该元素。

这样的事情：

  <div data-bind="text: traverse('this.a1().b().c().d')"/>
  <div data-bind="text: traverse('this.a2().b().c().d')"/>
  <script>
    var ViewModel = function() {
      this.a1 = ko.observable({b: ko.observable({c: ko.observable({ d: 'd value' })})});
      this.a2 = ko.observable({b: ko.observable()});
      this.traverse = function(path) {
        try {
          return eval(path);
        } catch(err) {
          return null;
        }
      }
    }
  </script>

Answer 3

我现在通过更改knockout.js第2597行来解决它：

 val = 'function(){return ' + val + ' }';

到：

 val = 'function(){try{return ' + val + ' }catch(e){console.warn(\''+val.replace(/'/g,"\"")+' - undefined property in path\');}}';

淘汰赛 - ＆gt;绑定到嵌套结构，其中Children可以为null

3 个答案: