FLEX:Data Binding 数据绑定

[color=red][b]务须精读的文章：[/b]
[size=medium][b]Flex data binding pitfalls: common misuses and mistakes：
[url]http://www.adobe.com/devnet/flex/articles/databinding_pitfalls.html[/url]

译文：Flex 数据绑定易犯的错误：普遍的误用和错误：
[url]http://www.cnblogs.com/kakaflex/archive/2011/04/14/2016340.html[/url]
[/b][/size][/color]


the '@{}' form is new in Flex 4 and is used to do two way binding.


原创系列之：Flex数据绑定基础介绍[转]:
[url]http://www.cnblogs.com/crkay/archive/2011/04/08/2009125.html[/url][quote]Flex为我们提供了多种使用数据绑定的方式，归纳起来通常有以下几种：
{}绑定实现
<Binding />标记绑定实现
应用BindingUtil类绑定实现
ChangeWacher绑定实现
[Bindable]元标签绑定实现
双向绑定[/quote]


Using data binding:
[url]http://www.adobe.com/devnet/flex/quickstarts/using_data_binding.html[/url]


[b][size=small]在做修改操作时(刚打开修改页面时要取vo，并将vo的值绑定到修改页面form的各个输入域；同时，在点击提交按钮后form各输入域的现有值也应该收集并绑定到要提交给后台的vo)，最好的收集页面数据的方式就是使用FLEX4的双向绑定新特性(FLEX3中也可以使用双向绑定的：输入域通过{}绑定vo属性；vo属性通过<mx:Binding source="输入域.text" destination="vo.property" />绑定页面输入域。从而得出：flex3的双向绑定是通过双方都是bindable来实现的；这里说的“felx4的双向绑定新特性”，指的是flex4中只在任一方做一次绑定就可以做到双向绑定的新特性)。[color=red]FLEX4两种实现双向绑定的新特性:[/size]
一 使用内联的 @{bindable_property} 语法
二 使用绑定标签（<mx:Binding> 或 <fx:Binding>） 时指定其twoWay="true"(twoWay是4新加的Binding标签属性)[/color][/b]
Two-way Data Binding - Functional and Design Specification：
[b][url]http://opensource.adobe.com/wiki/display/flexsdk/Two-way+Data+Binding[/url]（[color=red]这篇文章中的例子Examples非常好！[/color]）[/b][quote]The two ways to specify a two-way data binding are:
[list]
[*]inline declaration using the syntax, @{bindable_property}
[*]with MXML, <mx:Binding source="a.property" destination="b.property" twoWay="true />
[/list][/quote]
Two-Way Data Binding in Flex 4:
[b][url]http://www.artima.com/articles/two_way_binding.html[/url][/b][quote]Flex has provided one-way data binding since its inception, and Flex 4 adds two-way data binding as well: Flex 4's two-way data binding provides special syntax for specifying that a pair of object properties should always update each other.

Arranging for the two properties to mutually update each other [b]required two separate data binding steps in Flex 3[/b]:

<TextInput id="fahrenheit" text="{celsius.text}"/>
<TextInput id="celsius" text="{fahrenheit.text}">

In Flex 4, this [b]can be accomplished with a single expression[/b]（即4之新特性）:

<TextInput id="fahrenheit" text="@{celsius.text}"/>
<TextInput id="celsius">

[/quote]
Flex 3: Two-way Form Databinding：
[url]http://johncblandii.com/2008/06/flex-3-two-way-form-databinding.html[/url]
Bindable combobox - selected item/index:
[url]http://stackoverflow.com/questions/997504/bindable-combobox-selected-item-index[/url]


经测试：
[color=red][size=medium][b]@{}和<fx:Binding .. twoWay="true"/>两种实现双向绑定的方式是有区别的！[/b][/size][/color]：

<!-- 用这种方式绑定textinput输入框：如果 fidsDepfVo.flight(String类型) is null(比如在增加页面，在尚未输值情况下肯定应该是null)， 
	则使用了下面的绑定方式后fidsDepfVo.flight的值会由null变为空串""！即使你对调 fx:Binding 标签的source 和destination属性，问题依然存在。-->
	<fx:Binding source="flight.text" destination="fidsDepfVo.flight" twoWay="true"/>


	<!-- 用@{}的方式不会出现fidsDepfVo.flight 由 null变为空串 "" 的问题 -->
	<s:TextInput width="124" id="flight" text="@{fidsDepfVo.flight}" />

这里仅仅是对String（）的双向绑定问题做了探讨；其他类型，如Date、自定义Vo(最好不要是Object类型，而强转成自定义Vo，否则会报warning：unable to bind to property "xxx" on class Object(class is not an IEventDispatcher))等，在使用了fx:Binding 方式做双向绑定后是否会有问题,还待再议。
经测试：Number类型也存在这个问题!Flex中Number未初始化时的类型为NaN；当用<fx:binding>的方式对Number类型做绑定（startNum为Vo中类型为Number的属性）：

<fx:Binding source="dc8StartNum.text" destination="devChannelAC.getItemAt(7).startNum" />

这句绑定语句执行后，该Vo的startNum的值立马由NaN变成了0！


Binding read-only accessors in Flex：
[url]http://www.rubenswieringa.com/blog/binding-read-only-accessors-in-flex[/url]