knockout_主页的demo复习
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script src="http://localhost:81/js/knockout.js"></script>
</head>
<body>
<div data-bind="foreach: peoples">
<p>Person<span data-bind="text: person"></span></p>
<ul data-bind="foreach: children">
<li data-bind="text : $data"></li>
</ul>
<h4 data-bind="visible: $root.showTime">
<!--
<h4 data-bind="visible: $parent.showTime">这样也行;
-->
render time = <b data-bind="text: new Date().getSeconds()"></b>
</h4>
<input type="text" data-bind="value:childValue">
<button data-bind="click: addChild">addOne</button>
</div>
<label for="times">
<input type="checkbox" data-bind="value: showTime"/>
</label>
<script>
//在knockout中的所有绑定都是通过 元素属性的 data-bind=""进行绑定的，只要有两种绑定方式：ko.observable绑定变量，ko.observableArray绑定数组;
function Person(name,child) {
this.person = ko.observable();
this.children = ko.observableArray(child);
this.childValue = ko.observable("c0");
this.addChild = function(){
this.children.push( this.childValue )
}
};
var peoples = {
peoples : [new Person("t",["7","8","9"]),new Person("tt",["6","5","4"]),new Person("qihao",["1","2","3"])],
showTime : ko.observable(false)
};
ko.applyBindings( peoples );
</script>
</body>
</html>
knockout_主页的demo复习的更多相关文章
- Android模拟微信主页面的Demo
Android模拟微信主页面的Demo 效果图如下: 项目结构图如下: ContanctFragment: package com.demo.moniwexin; import android.app ...
- Ionic 左侧菜单(登录主页详情demo)
1.项目结构 2.截图效果展示 3.主要js 代码 $stateProvider .state('app', { url: "/app", abstract: tru ...
- iOS Swift最简单的Animation
最近发现Animation是一个iOS开发中非常好玩的元素,能给应用的交互性增色不少.比如很多音乐应用的菜单从底部弹出和隐藏的效果. Animation最核心的当然就是UIView的animateWi ...
- workerman使用编译安装workerman的php环境
提示 workerman只是一个代码包,如果php环境满足要求,下载后即可使用,实际上没有安装过程. workerman对php环境的要求是: 1.php>=5.3.3,可以运行命令php-v查 ...
- Validation in jQuery
jquery.validate.js github地址 官方主页 doc demo jquery-validation-unobtrusive github地址 demo doc
- Vim打开文件中文乱码如何解决?
今天想找一下之前的随机数组demo复习,在源文件src里用vim打开.java文件,中文出现乱码 vim也是,选项里没有直接选择设置utf-8之类的 查了下网上,http://easwy.com/bl ...
- NoHttp详解之NoHttp最基本使用（无封装）
NoHttp详细使用文档,请点我移步! 这里是一个最基本的使用,在项目中也可以直接这样使用,如果想学习更多请移步NoHttp主页: https://github.com/yanzhenjie/NoHt ...
- Python 库打包分发、setup.py 编写、混合 C 扩展打包的简易指南（转载）
转载自:http://blog.konghy.cn/2018/04/29/setup-dot-py/ Python 有非常丰富的第三方库可以使用,很多开发者会向 pypi 上提交自己的 Python ...
- 复习 | 彻底弄懂Flexbox之Demo篇
flexbox之前有接触,写项目时也用过,但也只是简单的,对其也是似懂非懂,所以今天下定决心把这个再学一遍,因为似懂非懂就是不懂 本文主要是的demo演示,想看flexbox语法 请移步flexbox ...
随机推荐
- 《TCP/IP 详解 卷一》读书笔记 -----第四章 ARP
1.一个物理层的网络,例如以太网,可以同时被多个不同的网络层所使用.例如网络中的一些主机使用TCP/IP协议,其他主机使用其他的网络协议. 2.设备驱动软件从不关心IP数据报中的目的IP地址.这也是为 ...
- UVA 11766 Racing Car Computer --DP
题意:电脑记录了某一时刻每个赛车的前面和后面个有多少辆车(多个车并排时在别的车那只算一辆),问最少有多少个不合理的数据. 分析:看到n<=1000时,就尽量往DP上想吧. 每输入一组数据a,b, ...
- vs2012无法启动已配置的开发Web服务器
] 有些教程说要开,我就没懂了
- POJ 1002 487-3279
A - 487-3279 Time Limit:2000MS Memory Limit:65536KB 64bit IO Format:%I64d & %I64u Submit ...
- 视频会议的3G智能手机移植技术
现今的视频会议系统已经兼容3G手机等移动终端设备,而3G智能手机使用的操作系统一般与PC的操作系统不一样,其开发环境一般都在PC上进行,通过模拟器在PC上进行手机系统的应用程序开发,而在这些操作系统上 ...
- 使用dynamic获取类型可变的json对象
标题可能有点含糊不清 我这个例子的来源是,对方会返回给我json,不过成功的json与失败的json是不同的对象 我想用一个方法获取到这个对象的所有属性并打印到log中 因为是动态变化的,所以第一个想 ...
- 将博客搬至CSDN（放弃）
将博客搬至CSDN需要发这篇文章,但是到现在CSDN还没给我发通知,因为急着要记东西,所以不搬了,继续写我下一篇随笔.
- ASP.NET中进行消息处理(MSMQ) 三
在本文的前两篇文章里对MSMQ的相关知识点进行了介绍,很多阅读过这前两篇文章的朋友都曾问到过这样一些问题: 1.如何把MSMQ应用到实际的项目中去呢? 2.可不可以介绍一个实际的应用实例? 3. ...
- .Net中的异步编程总结
一直以来很想梳理下我在开发过程中使用异步编程的心得和体会,但是由于我是APM异步编程模式的死忠,当TAP模式和TPL模式出现的时候我并未真正的去接纳这两种模式,所以导致我一直没有花太多心思去整理这两部 ...
- Linux及安全——模块
Linux及安全——模块 一.模块的编译.生成.测试.删除 1.编写模块代码 编写:gedit test.c 查看:cat test.c 2.查看版本信息 3.编写Makefile obj-m :这个 ...