knockout的监控数组没有想象中的强大,只能监控数组元素的位置变化,或个数的增减,然后对视图对应区域进行同步。

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="knockout.js"></script>
<script> </script>
</head>
<body>
<table>
<thead>
<tr><th>First name</th><th>Last name</th></tr>
</thead>
<tbody data-bind="foreach: people">
<tr>
<td data-bind="text: firstName"></td>
<td data-bind="text: lastName"></td>
</tr>
</tbody> </table>
<!-- 不能将监控属性与$index相加,否则页面直接打印$index的实现,$index貌似只能单个使用 -->
<ul data-bind="foreach: people">
<li data-bind="text: $index"></li>
<li data-bind="text: firstName + $index"></li>
</ul>
<script type="text/javascript">
var a = {
people: ko.observableArray([
ko.observable({firstName: 'Bert', lastName: 'Bertington'}),
ko.observable({firstName: 'Charles', lastName: 'Charlesforth'}),
ko.observable({firstName: 'Denise', lastName: 'Dentiste'})
])
} ko.applyBindings(a);
setTimeout(function() {
a.people()[1]({firstName: "7777", lastName: "3333"})
a.people.push({firstName: 'xxx', lastName: new Date})
}, 700)
</script>
</body>
</html>

首先它那个对绑定属性的值的parser本来就非常弱,$index好像只能独立使用。像avalon的parser也非常弱,但我另一个转换为求值函数的parser还是能拿得出手的。

其次,对数组的元素的操作不太人性化。如果我们是用 a.people()[1]({firstName: "7777"}),那么它的lastName的位置为空白,看来它是做替换操作而不是更新操作。

knockout 监控数组的缺点的更多相关文章

  1. Knockout 监控数组对象属性

    代码: function Product(ProductID,ProductName,ProductNum,Result,Price) { this.ProductID = ko.observable ...

  2. knockout的监控数组实现

    knockout应该是博客园群体中使用最广的MVVM框架,但鲜有介绍其监控数组的实现.最近试图升级avalon的监控数组,决定好好研究它一番,看有没有可借鉴之处. ko.observableArray ...

  3. Knockout学习之监控数组

    监控数组 单个监控属性.组合属性虽然可以解决大部分的问题,但是还有很多是他们无法做到的,比如在一组数据中进行移除添加,所以这节我们将要学习监控数组. 由于监控属性是由ko的observable构造,那 ...

  4. 监控数组与foreach绑定-Knockout.js

    html: <h2>Your seat reservations</h2> <table>    <thead>  <tr>         ...

  5. Knockout v3.4.0 中文版教程-4-通过监控数组工作

    2.通过监控数组工作 1. 监控数组 如果你想检测或者响应一个对象的改变,你用observables.如果你想检测和响应一个集合的改变,使用observableArray.这个在很多情况下都非常有用, ...

  6. knockout Observable Array(监控数组)

    Observable Array(监控数组)的作用 列表操作是经常会遇到的一个场景,使用监控数组,你可以: 保存列表对象,并且使用Ko提供的丰富的API操作列表元素(支持内建js Array的方法,以 ...

  7. (初)Knockout 监控属性(Observables)

    1 创建带有监控属性的view model 1.1 Observables Knockout是在下面三个核心功能是建立起来的: 监控属性(Observables)和依赖跟踪(Dependency tr ...

  8. c/c++ 传统数组的缺点

    专题:  动态内存分配 (所有高级语言,没有C里深刻) 传统数组的缺点: 1.数组长度必须事先指定,而且只能是常整数,不能是变量     例子 ]; //必须事先指定,而且只能是常整数 ; int a ...

  9. Knockout获取数组元素索引的2种方法,在MVC中实现

    原文:Knockout获取数组元素索引的2种方法,在MVC中实现 在遍历数组.集合的时候,通常要获取元素的索引,本篇体验使用Knockout获取索引的2种方法. 假设有这样的一个模型: namespa ...

随机推荐

  1. 类的大小——sizeof 的研究

    类的大小——sizeof 的研究(1) 先看一个空的类占多少空间? class Base { public: Base(); ~Base(); }; 注意到我这里显示声明了构造跟析构,但是sizeof ...

  2. erlang代码片段

    转载自http://blog.csdn.net/sw2wolf/article/details/6797708 .列表操作 lists:foreach(fun(X) -> io:format(& ...

  3. home-brew 安装&下载

    安装: ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)&qu ...

  4. c++声明与定义

    c++声明与定义 声明是将一个名称引入程序.定义提供了一个实体在程序中的唯一描述.声明和定义有时是同时存在的. 如 int  a; extern int b=1; 只有当extern中不存在初始化才是 ...

  5. Home vs2013

        Microsoft Visual Studio Ultimate 2013 版本 12.0.30110.00 Update 1 Microsoft .NET Framework 版本 4.5. ...

  6. python抓取网页例子

    python抓取网页例子 最近在学习python,刚刚完成了一个网页抓取的例子,通过python抓取全世界所有的学校以及学院的数据,并存为xml文件.数据源是人人网. 因为刚学习python,写的代码 ...

  7. AutoCAD DxfCode组码值说明

    值 说明 -5 APP:永久反应器链 -4 APP:条件运算符(仅与 ssget 一起使用) -3 APP:扩展数据 (XDATA) 标记(固定) -2 APP:图元名参照(固定) -1 APP:图元 ...

  8. iOS面向编码|iOSVideoToolbox:读写解码回调函数CVImageBufferRef的YUV图像

    iOS面向编码|iOSVideoToolbox:读写解码回调函数CVImageBufferRef的YUV图像 本文档基于H.264的解码,介绍读写Video Toolbox解码回调函数参数CVImag ...

  9. [翻译][Trident] Trident state原理

    原文地址:https://github.com/nathanmarz/storm/wiki/Trident-state ----------------------------- Trident在读写 ...

  10. python sleep

    Python Sleep休眠函数 Python 编程中使用 time 模块可以让程序休眠,具体方法是time.sleep(秒数),其中"秒数"以秒为单位,可以是小数,0.1秒则代表 ...