JavaScript数据绑定的结构示例.pptVIP

Data Binding的体系结构思考 Knockout.js的绑定结构 结构缺陷 由于1个ViewModel对应到一个View，对于单页面的Web应用程序来说，如果一个页面要绑定多个数据源，就不太灵活。 改进Knockout.js的绑定 举例 示例说明 如果一个窗口上要绑定2个ViewModel，现在我是通过一个Knockout.js的扩展来实现，这种扩展要求一个绑定容器，通过DataModel指定其容器的ViewModel，这是在TDBGroupBox中我的实现。 option.controls = [ {className:TDBGroupBox,id:GroupBox1,left:10,top:10,width:450,height:400,caption:Data Model Demo,datamodel:VM, handleClick: function(sender){ var form = sender.parentForm; ko.attach(VM,form.vm); }, 示例说明 每个不同的容器控件使用由datamodel指定的ViewModel，那么就可以解决在一个窗口上绑定不同数据源的需求 当前TDBEdit等控件绑定功能实现的不好之处 在实现TDBEdit、TDBListBox时，绑定是通过HardCode并且硬转换到Knockout声明式绑定语法来实现的。 它很不灵活，不利于扩展。比如Knockout.js是支持控件属性绑定的，比如可以将Enable、Visable、Color等与ViewModel绑定的。而示例中仅绑定了控件的Value属性。 WinForm的绑定架构 新的绑定体系结构构想 TBindingObject：包含2个属性BindingProperty和BindingValue。 TBindingManager：用来管理多个BindingObject TBindingContext：用来管理多个BindingManager TBindingContext在容器级，用来管理容器内的多个绑定对象。 TBindingManager在控件级，用来管理多个不同的属性的绑定，分配绑定优先级。 TBindingObject在属性级，一个属性对应的属性值。 新的绑定体系结构构想 在Render控件时，将TBindingManager输出为Knockout.js的声明式绑定语法。这种方式灵活易用易控展，当Knockout.js的绑定结构变化时，减少了变动的代码量。 * * *