Knockout JS：检查 IF 绑定中是否存在可观察对象答案

【问题标题】：Knockout JS: checking for the existence of an observable in an IF bindingKnockout JS：检查 IF 绑定中是否存在可观察对象
【发布时间】：2012-02-24 07:19:09
【问题描述】：

我正在为几个略有不同的对象渲染一个类似的 HTML 块。它们有 90% 相同，但每一个都有一些特定的怪癖，需要额外的 observables。我想在模板块中呈现这些大部分相似的项目，但我遇到了未定义对象的问题。

基本上，我想在模板中渲染它之前检查它是否存在。

我正在尝试做这样的事情：

<div data-bind="foreach: blocks">
<h2 data-bind="text: normalHeader"><h2>
<p data-bind="text: normalText"></p>
<!-- ko if: specialText --><p data-bind="text: specialText"></p><!-- /ko -->
</div>

因此，如果对于 blocks 的迭代不存在 specialText（不仅没有值，而且根本不存在），则忽略条件。我得到的错误是：

Uncaught Error: Unable to parse bindings.
Message: ReferenceError: specialText is not defined;

根据我对 Knockout 的“if”绑定的理解，如果对象返回任何类型的类似 false 的值（如 null 或 undefined），它应该可以工作，这意味着 if 绑定应该正常失败，但绝对不是.

有什么办法可以做到吗？

【问题讨论】：

标签： javascript knockout.js

【解决方案1】：

您可以使用以下方法：

<!-- ko foreach: Items -->
    <strong data-bind="text: Foo"></strong>
    <br />
    <!-- ko if: $data.hasOwnProperty("Bar") -->
        <p data-bind="text: Bar"></p>
    <!-- /ko -->
<!-- /ko -->

我已经发布了一个working demo

【讨论】：

但是，如果属性出现，它当然不会改变，因为它是不可观察的
它没有做人们通常想做的事情，“当然”？好一个

【解决方案2】：

基于 Oybek 的解决方案，您还可以这样做：

<!-- ko foreach: Items -->
    <strong data-bind="text: Foo"></strong>
    <br />
    <!-- ko if: "Bar" in $data -->
        <p data-bind="text: Bar"></p>
    <!-- /ko -->
<!-- /ko -->

示例： http://jsfiddle.net/MecNx/56/

【讨论】：

这也可以，但是 hasOwnProperty 函数更简洁一些；谢谢！
此解决方案处理多态对象，而如果您要查找的属性已添加到原型中，则 hasOwnProperty() 将失败。在为 each 执行 a 时，最好使用 hasOwnProperty() 排除原型属性，但在这个用例中，我会说直接检查“未定义”是更可取的。

【解决方案3】：

您可以通过对象的索引器访问来做到这一点：

<!-- ko foreach: Items -->
    <strong data-bind="text: Foo"></strong>
    <br />
    <!-- ko if: $data["Bar"] -->
        <p data-bind="text: Bar"></p>
    <!-- /ko -->
<!-- /ko -->

【讨论】：

【解决方案4】：

试试这个：

<!-- ko if: specialText != null -->

ko 会将其识别为表达式而不是值，因此它应该按您的意愿工作:)

【讨论】：