ko.js 数据遍历——获取索引
2015-09-25 10:28
471 查看
<label>博主</label> <div data-bind="text:User.title"></div> <label>地域</label><div data-bind="text:User.address"></div> <label>所经历的等级 </label> <ul data-bind="foreach:Level"> <li>索引:<span data-bind="text: $index"></span>,数值:<span data-bind="text: $data"></span></li> </ul> <label>所购买的 </label> <div data-bind="foreach:SaleDetail"> [<span data-bind="text:id"></span>] <span data-bind="text:memo"></span> [<a href="javascript:;" data-bind="click:$parent.remove">移除</a>]<hr /> </div> <script type="text/javascript"> var Demo = function () { var self = this; self.User = { title: "test knockout js", address: "beijing" }; self.Level = [10, 20, 30, 40, 50]; self.SaleDetail = ko.observableArray([ { id: 1, memo: '2005-01,消费购买了水壶' }, { id: 2, memo: '2006-03,消费购买了手机' }, { id: 3, memo: '2006-10,消费购买了手机' } ]); for (var i = 0; i < 5; i++) { self.SaleDetail.push({ id: i + 4, memo: '2005-01,消费购买了水壶' }) } self.remove = function () { self.SaleDetail.remove(this); } } ko.applyBindings(new Demo()); </script>
重要看一下HTML部分
其中$index表示为组件的索引值,它从0开始,$data表示这个索引对应的具体的值,看一下程序运行结果的截图
转自http://www.cnblogs.com/lori/p/4022284.html
相关文章推荐
- JS table表格间线重叠的问题
- js重定向的两种方法,原页与新开页
- javascript 精典案例分析一览
- 《Effective JavaScript》- 1.3 当心隐式的强制转换
- js中的逻辑运算(&&和||)
- JSP中c:if 标签的使用
- JS实现仿QQ效果的三级竖向菜单
- js小功能
- javascript相框echarts插件实现酷立方效果图的人
- js判断手机号的号码段的服务商
- ++a和a++的差别
- js获取cookie
- 在chrome浏览器中执行javascript
- Web API 实现JSONP或者安装配置Cors跨域
- JS+CSS实现仿支付宝菜单选中效果代码
- 深入浅出Extjs4.1.1视频教程
- JavaScript连接符前面数字后面字符串和前面字符串后面数字的差别
- 原生javascript中的一些方法
- Extjs-工具条和菜单 Ext.menu和Ext.Toolbar
- knockoutJS学习笔记08:表单域绑定