Knockout是在下面三个核心功能是建立起来的:
  1. 监控属性(Observables)和依赖跟踪(Dependency tracking)
  2. 声明式绑定(Declarative bindings)
  3. 模板(Templating)
工作中,最重要的是建模,模型建好了,能减少很多的工作和代码,只要着重于维护好自己的模板。
用好它的依赖关系可以使连动很省事,不用操作dom元素,全部都是dom bind ,使页面和数据相分离,结构更清晰,更易于维护
简单例子:
html:
<p>First name: <input data-bind="value: firstName"/></p>
<p>Last name: <input data-bind="value: lastName"/></p>
<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>
javascript:
var viewModel = {
firstName: ko.observable("Planet"),
lastName: ko.observable("Earth")
}; viewModel.fullName = ko.dependentObservable(function () {
// Knockout tracks dependencies automatically.
//It knows that fullName depends on firstName and lastName,
//because these get called when evaluating fullName.
return viewModel.firstName() + " " + viewModel.lastName();
}); ko.applyBindings(viewModel); // This makes Knockout get to work eg2:foreach循环输出
<table> 
<thead> 
<tr> 
<td>Name</td> 
<td>Amount</td> 
<td>Price</td> 
</tr> 
</thead> 
<tbody data-bind="foreach: items"> 
<tr> 
<td data-bind="text: product.name"></td> 
<td><select data-bind="options:[1,2,3,4,5,6],value: amount"></select></td> 
<td data-bind="text: subTotal"></td> 
</tr> 
</tbody> 
</table>
当我改变模型里边的 firstname时,不仅模型里边的值改变了,页面上相应的值也会变。
现在项目中用到的:
1.ko的依赖属性
2.表单验证
3.模板
等等
也可以添加自定义的绑定。
												

ko 简单例子的更多相关文章

  1. Hibernate4.2.4入门(一)——环境搭建和简单例子

    一.前言 发下牢骚,这段时间要做项目,又要学框架,搞得都没时间写笔记,但是觉得这知识学过还是要记录下.进入主题了 1.1.Hibernate简介 什么是Hibernate?Hibernate有什么用? ...

  2. AgileEAS.NET SOA 中间件平台.Net Socket通信框架-简单例子-实现简单的服务端客户端消息应答

    一.AgileEAS.NET SOA中间件Socket/Tcp框架介绍 在文章AgileEAS.NET SOA 中间件平台Socket/Tcp通信框架介绍一文之中我们对AgileEAS.NET SOA ...

  3. spring mvc(注解)上传文件的简单例子

    spring mvc(注解)上传文件的简单例子,这有几个需要注意的地方1.form的enctype=”multipart/form-data” 这个是上传文件必须的2.applicationConte ...

  4. mysql定时任务简单例子

    mysql定时任务简单例子 ? 1 2 3 4 5 6 7 8 9     如果要每30秒执行以下语句:   [sql] update userinfo set endtime = now() WHE ...

  5. java socket编程开发简单例子 与 nio非阻塞通道

    基本socket编程 1.以下只是简单例子,没有用多线程处理,只能一发一收(由于scan.nextLine()线程会进入等待状态),使用时可以根据具体项目功能进行优化处理 2.以下代码使用了1.8新特 ...

  6. 一个简单例子:贫血模型or领域模型

    转:一个简单例子:贫血模型or领域模型 贫血模型 我们首先用贫血模型来实现.所谓贫血模型就是模型对象之间存在完整的关联(可能存在多余的关联),但是对象除了get和set方外外几乎就没有其它的方法,整个 ...

  7. [转] 3个学习Socket编程的简单例子:TCP Server/Client, Select

    以前都是采用ACE的编写网络应用,最近由于工作需要,需要直接只用socket接口编写CS的代码,重新学习这方面的知识,给出自己所用到的3个简单例子,都是拷贝别人的程序.如果你能完全理解这3个例子,估计 ...

  8. jsonp的简单例子

    jsonp的简单例子 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...

  9. Java-马士兵设计模式学习笔记-观察者模式-AWT简单例子

    1.AWT简单例子 TestFrame.java import java.awt.Button; import java.awt.Frame; import java.awt.event.Action ...

随机推荐

  1. 油猴 greasemonkey 背景音乐 火狐 chrome 背景音乐

    火狐,chrome背景音乐 http://www.w3school.com.cn/tags/tag_audio.asp js插入背景音乐,猴油脚本使用 var audio = document.cre ...

  2. 用PHP解析类JSON字符串为数组的实现

    题目:把字符串嵌套关系转换成数组,字符串只包含成对中括号.数字和逗号字符串:(1,(1,2,(1,(1,2,(1)),3)),3,(1,(1,2,((1((1,(1,2,(1,2,3),4,5),3) ...

  3. JS 跳转页面 在新的选项卡打开

    function going(url) { var a = $("<a href='" + url + "' target='_blank'>Apple< ...

  4. 数据加密标准——DES

    DES算法和DESede算法统称DES系列算法.DES算法是对称加密算法领域中的典型算法,为后续对称加密算法的发展奠定了坚实的基础.但是DES算法密钥偏短,仅有56位,迭代次数偏少,受到诸如查分密码分 ...

  5. 数据表格datagrid内容整理

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  6. Android网络连接判断与处理

    博客分类: Android 获取网络信息需要在AndroidManifest.xml文件中加入相应的权限. <uses-permission android:name="android ...

  7. Codeforces Round #211 (Div. 2) D题(二分,贪心)解题报告

    ---恢复内容开始--- 题目地址 简要题意: n个小伙子一起去买自行车,他们有每个人都带了一些钱,并且有公有的一笔梦想启动资金,可以分配给任何小伙子任何数值,当然分配权在我们的手中.现在给出m辆自行 ...

  8. Bootstrap<基础二> 网格系统

    Bootstrap 提供了一套响应式.移动设备优先的流式网格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列. 什么是网格(Grid)? 摘自维基百科: 在平面设计中,网格 ...

  9. Android - 设置TextView的字体行间距 - TextView

    xml文件中给TextView添加: android:lineSpacingExtra="10dp"// 行间距 android:lineSpacingMultiplier=&qu ...

  10. C#将字节流加密解密

    public class Encrypt { public static byte[] ToEncrypt(string encryptKey, byte[] P_byte_data) { try { ...