Flex Data Binding Detailed

Source: Internet
Author: User
Tags cdata tostring

The Data binding simply means that when the binding source attribute changes, Flex assigns the value of the property to the property of the object after the binding source has changed. Do the data synchronization.

When does the Data BindIng occur:

1. Occurs when the value of the binding source property has changed.

2. Binding occurs once when the binding source issues a initialize event.

To make a property bindable:

In general, just precede the attribute with the

[bindable] or
[Bindable (event= "EventName")]

META tags can

Attention:

If the event that triggers the binding is not marked, as [Bindable],flex automatically adds the PropertyChange event to the binding, Flex automatically distributes the event when the source data changes, triggering the data binding. If the modified data and the source data "= =" is congruent, then flex will not trigger data binding.

If the marked event triggers a binding, as [Bindable (event= "EventName")], then the event must be dispatch out when the source data changes to trigger the data binding. Regardless of whether the modified data and the source data are congruent, flex triggers the data binding and requires its own programmatic control, for example:

<mx:Script>
           <!--[cdata[
             [Bindable (event= "HHHH")]
             private var ss:string= "AAA"; 
             Private Function Dotest (): void
             {
              ss= "BBB";
    F (ss!== "AAA")//To determine whether the source data is equal and unequal triggers the binding
    this.dispatchevent (The New Event ("HHHH")); 
             }]
           -->
    </mx:Script>
 <mx:text text= "{ss}"/>
<mx:button click= "dotest ()"/>

If there is no this.dispatchevent (the new Event ("HHhH"), then you click on the button is not set to effect. In addition, when the declaration of custom trigger events, with Changewatcher to monitor their changes, found that although the target source value has changed, but Changewatcher monitoring does not change, the same changewatcher also monitor the change of the non shared variables. As for Changewatcher, the following will be mentioned.

Binding function--functions, Object--object, array--arrays

Function:

You can use functions directly in {}. For example: <mx:text text= "{matn.random () *ss}"/>

There's nothing to say about this, but this is more important for function binding:

<mx:Script>
       <!--[cdata[public
         var ss:string= "AAA";
         [Bindable (event= "HHHH")]
         Private Function GG (): String
         {return
          ss;
         }
         Private Function Dotest (): void
         {
          ss=math.random (). toString ();
          This.dispatchevent (New Event ("HHHH"));
         }
       ] -->
   </mx:Script>
<mx:text text= "{GG ()}"/>
<mx:button click= "dotest ()"/>

This adds a [bindable] to the function, which makes the function binding, but if you do not declare a custom trigger event, you can only bind it once when the component is initialized, and clicking the button above does not work. We can try it by ourselves.

There are getter and setter functions, and it's important to add [bindable] to the getter or setter function, no more than two, plus one, for example:

<mx:Script>
       <!--[cdata[public
        var ss:string= "AAA";
         [bindable]
         Public function Get GG (): String
         {return
          ss;
         }
         Public function set GG (value:string): void
         {
          ss=value;
         }
         Private Function Dotest (): void
         {
          gg=math.random (). toString ();
          This.dispatchevent (New Event ("HHHH"));
         }
       ] -->
   </mx:Script>
<mx:text text= "{gg}"/>
 <mx:button click= "dotest ()"/>

Also can achieve binding effect, if there is only one getter method, then want to implement data binding, you need to declare a custom trigger event, you can try.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.