knockout.js 如果/如果不是

示例

您可以使用if绑定来确定是否应创建节点的子元素。

<div class="product-info">
    <h2>  Product1  </h2>
    <img xx_src="../products/product1.jpg"/>
    <span data-bind="if:featured">
        <span class="featured"></span>
    </span>
    <span data-bind="ifnot:inStock">
        <span class="out-of-stock"></span>
    </span>
</div>
     
<script>
    ko.applyBindings({
        product: {
            featured: ko.observable(true),
            inStock: ko.observable(false)
        }
    });
</script>

if绑定的逆是ifnot

<div data-bind="ifnot: someProperty">...</div>

相当于

<div data-bind="if: !someProperty()">...</div>

有时,您无需创建容器就无法控制元素的存在(通常是针对中的<li>元素<ul>或中的<option>元素<select>)

淘汰赛可使用基于注释标签的无容器控制流语法来实现此目的,如下所示:

<select>
  <option value="0">fixed option</option>
<!-- ko if: featured-->
  <option value="1">featured option</option>
<!-- /ko -->
</select>