一、知识点了解：在页面数据改变时，更新绑定的数据源
- 单项数据绑定：指我们先把模板写好，然后把模板和数据整合到一起形成html代码，再把这段html代码插入到文档流中区
特性：html一旦生成以后，就没有办法再变了，如果有新的数据来了，那就必须把之前的html代码去掉，再把新的数据和模板一起整合后插入到文档流中。
- 双向绑定：数据模型（Model）和视图（View）之间的双向绑定。
特性：用户在视图上的修改会自动同步到数据模型中去，同样，如果数据模型中的值发生了变化，也会立刻同步到视图中去
二、kendo数据绑定
思路是通过在数据对象上定义get和set方法，调用时手动调用set或get数据，改变数据后触发UI层的渲染操作；以视图驱动数据变化的场景主要应用于input、select、textarea等元素，当UI层变化时，通过监听dom的change，keypress，keyup等来触发事件改变数据层的数据。整个过程均通过函数调用方法完成。
Kendo UI MVVM 数据绑定支持的绑定属性有 attr, checked, click, custom , disabled,enabled, events, html, invisible, , style, text ,value, visible ，这些属性可以绑定到 DOM 元素或是 Kendo UI 组件的属性。
以attr方法为例：
<img id="logo" data-bind="attr: { src: imageSource, alt: imageAlt }" />
<script>
var viewModel = kendo.observable({
imageSource: "http://www.kendoui.com/image/kendo-logo.png",
imageAlt: "Kendo Logo"
});
kendo.bind($("#logo"), viewModel);
</script>
image 元素的 src 和 alt 属性被绑定到 viewModel 对象的 imageSource 和 imageAlt 属性。 当调用 kendo.bind 方法，image 元素和下面 HTML 元素等效：
其他绑定方法和attr大同小异！
三、Kendo DataSource
kendo的数据源支持本地数据（Javascript对象数组），或者远程数据源（XML、JSON、JSONP），支持CRUD操作（创建、读取、更新和删除操作）。
于是就想访问一个万屏汇的接口试一下，如果直接访问万屏汇接口会报错，因为kendo里面的一些方法是针对返回的数据为数组来操作的（而我们的接口返回的是对象）。所以通过现有的环境为基础，运用mock数据，重新做了一个b44的接口数据。
1.首先运用Browsersync.cn来访问本地服务器。查看Browsersync的安装步骤及好处点击http://www.browsersync.cn/
2.在将返回的格式改为数组
3.格式为：
<script>
var dataSource = new kendo.data.DataSource({
autoSync: true,
transport: {
read: {
url: "http://m2.xxtao.com:2080/index.php?r=demand%2Fb44&demand_id=10590",
dataType: "json" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
},
update: {
url: "http://m2.xxtao.com:2080/index.php?r=demand%2Fb44&demand_id=10590",
dataType: "json" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests
}
},
schema: {
data: "data", //ajax返回的对象
model: { id: "ProductID" }
}
});
dataSource.fetch(function() {
var product = dataSource.at(0);
alert(product.now)
});
</script>
4.获取数据的长度为dataSource.view().length ；
我本以为能够将json返回来的数据通过kendo提供的数据绑定data-bind方法绑定在dom元素上，但是找遍了示例并没有找到，看来数据绑定和DataSource没有什么关系。而通过DataSource的数据是通过模板来渲染，我觉得和mustach有些相似。
四、结论
通过这几天的认识我觉得Kendo可能并不是太适用：
- 对于双向数据绑定来说，由于是自动管理状态，会有很多不得不手动处理的状态，这样便增加了复杂度
- 里面的UI其实就是jquery的一些插件，只是被kendo封装了一下，但还是原汤原料
- 先不说移动端，web端一些ui并不兼容ie8以下（开始还很兴奋，想着他是如何做到让html5兼容ie8的）
- DataSource的形式和mustach比较像，我觉得并不需要抛弃mustach
五、其他一些小方法
获取iframe可视区域的高度 $(window.parent).height()
1.refresh方法
2.datasource 中 请求接口的数据时,获取数据要用view()方法。例如：
获取条数的个数方法为： dataSource.view().length ;
获取第一条数据的内容：dataSource.view[0].name;
3.filter 设置数据过滤器
4.sync 默认值为false。如果设置为true表示数据源将自动调用保存任何改变的数据项。
！！！以上文章大部分属于我个人观点，如果有错误之处，希望帮忙指出！
