认识Knockout及如何使用Knockout绑定上下文
Knockout介绍
Knockout简称ko，是一个轻量级的javascript类库，采用MVVM设计模式（即Model、view、viewModel），简单优雅的实现了双向绑定，实时更新，帮助您使用干净的数据模型来创建丰富的、响应式的用户界面。
Knockout有三大核心特性：
1.优雅的依赖跟踪（Elegantdependencytracking）：任何时候数据模型的变化都会自动更新相应的UI部分；
2.声明式绑定（Declarativebindings）：简单的将UI和你的数据模型关联起来，你就可以创建复杂的动态UI；
3.高度可扩展性（Triviallyextensible）：只需几行代码实现一个自定义的行为来作为声明式绑定；
其他优点：
1.纯净的javascript代码；
2.可以随时添加到你现有的web应用中；
3.轻量级，GZIP后只有13K；
4.能够工作于几乎所有主流浏览器（(IE6+,Firefox2+,Chrome,Safari,Edge,others）；
ko采用的是MVVM设计模式，即modelviewviewModel。
简单的例子
Thereare<spandata-bind="text:myItems().length"></span>items
就是这么简单，你不必写代码来更新text内容，它会在数组长度改变时自动更新，与此类似，如果我们想利用数组长度控制按钮的可用性仅仅需要：
<buttondata-bind="enable:myItems().length<5">Add</button>
下面接着给大家介绍使用Knockout绑定上下文
Bindingcontext
bindingcontext是一个保存数据的对象，你可以在你的绑定中引用它。当应用绑定的时候，knockout自动创建和管理bindingcontext的继承关系。这种层次结构的根引用你指定的viewModel参数（ko.applyBindings(viewModel)）。
然后每次使用一个控制流如with或者foreach来创建一个子节点bindingcontext引用嵌套的viewModeldata。
$parent
<h1data-bind="text:name"></h1> <divdata-bind="with:manager"> <!--Nowwe'reinsideanestedbindingcontext--> <spandata-bind="text:name"></span>isthe managerof<spandata-bind="text:$parent.name"></span> </div>
$parents
这是一个数组，代表了所有的父节点viewmodels
$parent[0]:代表父节点；
$parent[1]:代表祖父节点；
$parent[1]:代表曾祖父节点；
.....以此类推
$root
它是rootcontext的根节点视图模型对象，一般是通过ko.applyBindings指定的，相当于$parents[$parents.length-1]。
$component
如果你在一个特定的组件模板的上下文中，$component指定的是那个component，它的指定组件相当于$root，在嵌套的组件情况下，它代表了最邻近的一个组件。
$data
它代表了当前上下文中的viewModel对象，$data和$root是相当的。在嵌套的bindingcontext中，这个参数将设置到当前的数据项。
$data是非常有用的，例如，当你想引用viewModel本身而不是viewModel的属性的时候。
<uldata-bind="foreach:['cats','dogs','fish']"> <li>Thevalueis<spandata-bind="text:$data"></span></li> </ul> $index(仅在foreachbinding中可用)
它是一个在foreach绑定中的数组的从0开始的索引条目。不想其他的context属性，$index是observable的，即会随着数组item的更新而更新。
$parentContext
指定了父节点级别的bindingcontext对象，与$parent不同的是，它是在父节点中指定数据而不是bindingcontext。
$rowData
它是在当前上下文中，原viewModel的值，通常它相当于$data，但是，如果viewModel被ko以observable来修饰，$data是unobservable的，而$rowData是observable的。