ko 简单例子
Knockout是在下面三个核心功能是建立起来的:
监控属性(Observables)和依赖跟踪(Dependency tracking)
声明式绑定(Declarative bindings)
模板(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 简单例子的更多相关文章
- Hibernate4.2.4入门(一)——环境搭建和简单例子
		
一.前言 发下牢骚,这段时间要做项目,又要学框架,搞得都没时间写笔记,但是觉得这知识学过还是要记录下.进入主题了 1.1.Hibernate简介 什么是Hibernate?Hibernate有什么用? ...
 - AgileEAS.NET SOA 中间件平台.Net Socket通信框架-简单例子-实现简单的服务端客户端消息应答
		
一.AgileEAS.NET SOA中间件Socket/Tcp框架介绍 在文章AgileEAS.NET SOA 中间件平台Socket/Tcp通信框架介绍一文之中我们对AgileEAS.NET SOA ...
 - spring mvc(注解)上传文件的简单例子
		
spring mvc(注解)上传文件的简单例子,这有几个需要注意的地方1.form的enctype=”multipart/form-data” 这个是上传文件必须的2.applicationConte ...
 - mysql定时任务简单例子
		
mysql定时任务简单例子 ? 1 2 3 4 5 6 7 8 9 如果要每30秒执行以下语句: [sql] update userinfo set endtime = now() WHE ...
 - java socket编程开发简单例子 与  nio非阻塞通道
		
基本socket编程 1.以下只是简单例子,没有用多线程处理,只能一发一收(由于scan.nextLine()线程会进入等待状态),使用时可以根据具体项目功能进行优化处理 2.以下代码使用了1.8新特 ...
 - 一个简单例子:贫血模型or领域模型
		
转:一个简单例子:贫血模型or领域模型 贫血模型 我们首先用贫血模型来实现.所谓贫血模型就是模型对象之间存在完整的关联(可能存在多余的关联),但是对象除了get和set方外外几乎就没有其它的方法,整个 ...
 - [转] 3个学习Socket编程的简单例子:TCP Server/Client, Select
		
以前都是采用ACE的编写网络应用,最近由于工作需要,需要直接只用socket接口编写CS的代码,重新学习这方面的知识,给出自己所用到的3个简单例子,都是拷贝别人的程序.如果你能完全理解这3个例子,估计 ...
 - jsonp的简单例子
		
jsonp的简单例子 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...
 - Java-马士兵设计模式学习笔记-观察者模式-AWT简单例子
		
1.AWT简单例子 TestFrame.java import java.awt.Button; import java.awt.Frame; import java.awt.event.Action ...
 
随机推荐
- Working with Data »  Getting started with ASP.NET Core and Entity Framework Core using Visual Studio »  更新关系数据
			
Updating related data¶ 7 of 7 people found this helpful The Contoso University sample web applicatio ...
 - SPSS数据分析—典型相关分析
			
我们已经知道,两个随机变量间的相关关系可以用简单相关系数表示,一个随机变量和多个随机变量的相关关系可以用复相关系数表示,而如果需要研究多个随机变量和多个随机变量间的相关关系,则需要使用典型相关分析. ...
 - APACHE 在windows下的配置
			
目前apache在windows下只支持到2.2 所以php必须下载相应的线程安全的 然后打开apache的配置页面 listen directory 和 load_module修改 httpd -k ...
 - sass2:
			
ass学习笔记2 今天介绍sass在重用代码时最具威力的两个功能.一个是嵌套(Nesting),一个混合(Mixin). 我们在写CSS通过需要多个后代选择器组合到一起才能定位到目标元素上,而这定义过 ...
 - Linux 常用命令集合
			
1. 常用命令 ls 显示当前目录下的文件和文件夹: -ltr 按时间顺序显示文件和文件夹的详细信息,不带参数的时候 只显示文件夹和文件. vi 打开文件的内容 tar -cvf file.tar ...
 - [原创]在Linux系统Ubuntu14.04上安装部署docker。
			
Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化.容器是完全使用沙箱机制,相互之间不会有任何 ...
 - spring开发的总结
			
1,当出现无法创建bean,( Error creating bean with name 'fileUploadService': Injection of resource dependencie ...
 - PHPExcel读取Excel文件的实现代码
			
<?php require_once 'PHPExcel.php'; /**对excel里的日期进行格式转化*/ function GetData($val){ $jd = GregorianT ...
 - C# Request中修改header信息
			
var headers = app.Context.Request.Headers; Type hdr = headers.GetType(); PropertyInfo ro = hdr.GetPr ...
 - 114 的 dns 的解析测试
			
114 的 dns 号称使用 BGP Global AnyCast 技术多点部署 的方式, 可以将用户请求导向到"就近"的服务器,理论上是可以得到域名网络就近解析的IP的,所以将 ...