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 ...
随机推荐
- DP+单调队列 codevs 1748 瑰丽华尔兹（还不是很懂具体的代码实现）
codevs 1748 瑰丽华尔兹 2005年NOI全国竞赛 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 大师 Master 题解 题目描述 Descripti ...
- POJ 2387 Til the Cows Come Home --最短路模板题
Dijkstra模板题,也可以用Floyd算法. 关于Dijkstra算法有两种写法,只有一点细节不同,思想是一样的. 写法1: #include <iostream> #include ...
- 浅谈CLR
1.什么是CLR CLR(Common Language Runtime)公共语言远行时,是一个可由多种编程语言使用的“远行时”.CLR的核心功能(比如内存管理.程序集加载.安全性.异常处理和线程同步 ...
- esc安装数据库 sqlserver mssql
在服务器里面设置虚拟内存为:2G以上就可以安装了
- Docker云Paas平台部署：Docker+Mesos+Marathon
针对“互联网+”时代的业务增长.变化速度及大规模计算的需求,廉价的.高可扩展的分布式x86集群已成为标准解决方案,如Google已经在几千万台服务器上部署分布式系统.Docker及其相关技术的出现和发 ...
- 部署Zipkin分布式性能追踪日志系统的操作记录
Zipkin是Twitter的一个开源项目,是一个致力于收集Twitter所有服务的监控数据的分布式跟踪系统,它提供了收集数据,和查询数据两大接口服务. 部署Zipkin环境的操作记录:部署Zipki ...
- python-基础案例
范例一: 练习:元素分类 有如下值集合 [11,22,33,44,55,66,77,88,99,90...],将所有大于 66 的值保存至字典的第一个key中,将小于 66 的值保存至第二个key的值 ...
- 15Spring_AOP编程(AspectJ)_抛出通知
- Linux共享库 日志方法
mylog.h #ifdef __cplusplus extern "C" { #endif //写日志函数 //path:日志文件名 //msg:日志信息 int writelo ...
- SRTM数据介绍与说明
一.SRTM 的背景引言 美国利用航天飞机搭载成像雷达对地进行观测始于20 世纪80 年代初.1982 年11 月和1985 年10 月, 美国分别进行了两次称为S IR2A 与S IR2B 的航天飞 ...