- KnockoutJS 教程
- KnockoutJS - 主页
- KnockoutJS - 概述
- KnockoutJS - 环境设置
- KnockoutJS - 应用程序
- KnockoutJS - MVVM 框架
- KnockoutJS - 可观察
- 计算的可观察项
- KnockoutJS - 声明性绑定
- KnockoutJS - 依赖项跟踪
- KnockoutJS - 模板
- KnockoutJS - 组件
- KnockoutJS 资源
- KnockoutJS - 快速指南
- KnockoutJS - 资源
- KnockoutJS - 讨论
KnockoutJS - 如果不绑定
如果没有绑定就是 if 绑定的否定。它只是 if 绑定的另一种形式。
语法
ifnot: <binding-condition>
参数
参数是您要检查的条件。如果该条件评估为真或类真值,那么将处理给定的 HTML 标记。否则,它将从 DOM 中删除。
如果参数中的条件包含可观察值,那么无论何时可观察值发生更改,都会重新评估条件。相应地,将根据条件结果添加或删除相关标记。
Explore our latest online courses and learn new skills at your own pace. Enroll and become a certified expert to boost your career.
示例
让我们来看一个展示如何使用 ifnot 绑定的示例。
<!DOCTYPE html> <head> <title>KnockoutJS ifnot binding</title> <script src = "https://ajax.aspnetcdn.com/ajax/knockout/knockout-3.1.0.js" type = "text/javascript"></script> </head> <body> <p><strong>Product details</strong></p> <table border = "1"> <thead> <th>Product Name</th><th>Price</th><th>Nature</th> </thead> <tbody data-bind = "foreach: productArray "> <tr> <td><span data-bind = "text: productName"></span></td> <td><span data-bind = "text: price"></span></td> <td data-bind = "ifnot: $data.price < 200 ">Expensive</td> </tr> </tbody> </table> <script type = "text/javascript"> function AppViewModel() { self = this; self.productArray = ko.observableArray([ {productName: 'Milk', price: 100}, {productName: 'Oil', price: 10}, {productName: 'Shampoo', price: 1200} ]); }; var vm = new AppViewModel(); ko.applyBindings(vm); </script> </body> </html>
输出
让我们执行以下步骤,了解上面的代码是如何工作的 −
将上述代码保存到if-not-bind.htm 文件中。
在浏览器中打开此 HTML 文件。
此示例将根据价格填充第三列,该列说明产品性质(昂贵或不昂贵)。请注意,使用 $data 绑定上下文访问单个属性。
knockoutjs_declarative_bindings.htm
广告