需要2個組件之間的2種方式綁定flex 4

Question

任何人都可以告訴我如何在2個組件之間進行雙向綁定？

我有一個TabGroup，我在其中創建2個標籤。每個標籤具有各種組分...

第一個標籤：某種形式的存在，並提交按鈕 第二個選項卡：的Datagrid

因此，當我輸入一些細節，然後單擊提交按鈕，應該在Datagrid中添加1行。此功能正在工作，但是當我雙擊Datagrid中的行時，Datagrid中的行詳細信息應填寫在窗體我沒有得到這個..

請檢查下面的代碼，運行它，並提供解決方案我：

Main.mxml

<?xml version="1.0" encoding="utf-8"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" 
       xmlns:components="components.*" 
       creationComplete="init()"> 

    <fx:Script> 
     <![CDATA[ 
      import components.EmployeeSingleton; 

      [Bindable] 
      public var empSingleton: EmployeeSingleton; 

      public function init(): void 
      { 
       empSingleton = EmployeeSingleton.getInstance(); 
      } 


     ]]> 
    </fx:Script> 

    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 


    <s:VGroup> 

     <s:TabBar dataProvider="{contact}" /> 

     <mx:ViewStack id="contact" 
         resizeToContent="true"> 

      <components:ContactInfo id="contactInfo" 
            label="Employee Info" 
            empSingleton="{empSingleton}"/> 

      <components:ContactList label="Employee List" 
            empSingleton="{empSingleton}"/> 


     </mx:ViewStack> 

    </s:VGroup> 

</s:Application> 

EmployeeSingleton.as

package components 
{ 
    import mx.collections.ArrayCollection; 

    [Bindable] 
    public final class EmployeeSingleton 
    { 
     private static var instance: EmployeeSingleton; 
     public var empData: ArrayCollection; 

     public function EmployeeSingleton() 
     { 
     } 

     public static function getInstance(): EmployeeSingleton 
     { 
      if(instance == null) 
       instance = new EmployeeSingleton(); 

      return instance; 
     } 


    } 
} 

EmployeeVO.as

package vo 
{ 
    [Bindable] 
    public class EmployeeVO 
    { 
     public function EmployeeVO() 
     { 
     } 

     public var empName: String; 
     public var address: String; 
     public var state: String; 
     public var city: String; 
     public var zip: String; 


    } 
} 

ContactInfo.mxml

<?xml version="1.0" encoding="utf-8"?> 
<s:NavigatorContent xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300"> 

    <fx:Script> 
     <![CDATA[ 
      import mx.collections.ArrayCollection; 

      import vo.EmployeeVO; 

      public var empSingleton: EmployeeSingleton; 

      private var empVO : EmployeeVO; 
      private var empCollection : ArrayCollection = new ArrayCollection(); 


      protected function submit_clickHandler(event:MouseEvent):void 
      { 
       empVO = new EmployeeVO(); 

       empVO.empName = empName.text; 
       empVO.address = address.text; 
       empVO.city = city.text; 
       empVO.state = state.text; 
       empVO.zip = zip.text; 

       empCollection.addItem(empVO); 

       empSingleton.empData = empCollection; 

      } 

     ]]> 
    </fx:Script> 

    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <s:Form> 

     <s:FormItem label="Name"> 
      <s:TextInput id="empName" /> 
     </s:FormItem> 

     <s:FormItem label="Address"> 
      <s:TextInput id="address" /> 
     </s:FormItem> 

     <s:FormItem label="City"> 
      <s:TextInput id="city" /> 
     </s:FormItem> 

     <s:FormItem label="State"> 
      <s:TextInput id="state" /> 
     </s:FormItem> 

     <s:FormItem label="Zip"> 
      <s:TextInput id="zip" /> 
     </s:FormItem> 

     <s:FormItem> 
      <s:Button id="submit" 
         label="Submit" 
         click="submit_clickHandler(event)"/> 
     </s:FormItem> 

    </s:Form> 

</s:NavigatorContent> 

ContactList.mxml

<?xml version="1.0" encoding="utf-8"?> 
<s:NavigatorContent xmlns:fx="http://ns.adobe.com/mxml/2009" 
     xmlns:s="library://ns.adobe.com/flex/spark" 
     xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300" 
     > 

    <fx:Script> 
     <![CDATA[ 
      [Bindable] 
      public var empSingleton: EmployeeSingleton; 

     ]]> 
    </fx:Script> 

    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
    </fx:Declarations> 

    <s:DataGrid id="empData" 
       dataProvider="{empSingleton.empData}"/> 

</s:NavigatorContent> 

等待的解決方案，請運行上面的代碼，並提供解決方案我2路結合

Answer 1

您不需要爲「雙擊列表中的項目進行更新」進行綁定。綁定非常緊密。你應該做的是聽取列表中的雙擊事件，並用雙擊的項目信息更新表單。