knockout.js 的CSS
示例
此绑定会将提供的CSS类应用于该元素。当将给定条件宽松地评估为true时，将应用静态类。动态类使用可观察或计算的值。
page.html
<p data-bind="css: { danger: isInDanger }">Checks external expression</p>
<p data-bind="css: { danger: dangerLevel() > 10 }">Expression can be inline</p>
<p data-bind="css: { danger: isInDanger, glow: shouldGlow }">Multiple classes</p>
<p data-bind="css: dynamicObservable">Dynamic CSS class from observable</p>
<p data-bind="css: dynamicComputed">Dynamic CSS class from computed</p>
page.js
ko.applyBindings({
isInDanger: ko.observable(true),
dangerLevel: ko.observable(5),
isHot: ko.observable(true),
shouldGlow: ko.observable(true),
dynamicObservable: ko.observable('highlighted'),
dynamicComputed: ko.computed(function() {
var customClass = "";
if(dangerLevel() >= 15 ) {
customClass += " danger";
}
if(dangerLevel() >= 10) {
customClass += " glow";
}
if(dangerLevel() >= 5) {
customClass += " highlighted";
}
return customClass;
});
});
page.css
.danger { background: red; }
.glow { box-shadow: 5px 5px 5px gold; }
.highlighted { color: purple; }
另请参阅：官方文档。
-
注意： 此教程已从官方删除 这个快速上手指南会告诉你如何结合使用TypeScript和Knockout.js。 这里我们假设你已经会使用Node.js和npm 首先，我们新建一个目录。 暂时命名为proj，当然了你可以使用任何喜欢的名字。 mkdir proj cd proj 接下来，我们按如下方式来组织这个工程： proj/ ├─ src/ └─ built/ TypeScript源
-
Knockout 是个JavaScript library，帮助创建丰富的显示和编辑器UI，通过干净的底层数据模型。你可以在任何时候动态更新UI的选择部分。
-
本文向大家介绍knockout.js 的HTML，包括了knockout.js 的HTML的使用技巧和注意事项，需要的朋友参考一下 示例 如果已引用jQuery，则此绑定使用来更新元素的innerHTML ，否则，将使用KO自己的解析逻辑。如果从API，RSS提要等中检索HTML，这将非常有用。请注意，将此标记与用户输入的HTML结合使用。jQuery.html() page.html page.
-
本文向大家介绍knockout.js Foreach，包括了knockout.js Foreach的使用技巧和注意事项，需要的朋友参考一下 示例 与其他语言中使用的中继器相似。通过此绑定，您可以为数组中的每个项目复制html块。 请注意，当我们遍历上下文时，它成为数组中的项，在本例中为的实例contactViewModel。在一个范围内，foreach我们还可以访问 $parent -创建此绑定的
-
本文向大家介绍knockout.js Attr，包括了knockout.js Attr的使用技巧和注意事项，需要的朋友参考一下 示例 使用attr绑定将任何其他属性应用于元素。最常用于设置href，src或任何数据属性。
-
本文向大家介绍knockout.js ngShow，包括了knockout.js ngShow的使用技巧和注意事项，需要的朋友参考一下 示例 用于动态显示/隐藏元素的AngularJS代码： 相当于KnockoutJS：