2012-03-25 26 views
1

私はSencha Touch 2アプリケーションを作成しています。私は最近、次の問題を抱えています。Sencha Touch 2の子コンポーネントから親コンポーネントのデータにアクセスする

私は、データがsetRecord(myRecord)でバインドされたコンテナビューを持っています。だから私の質問は、このデータをサブコンポーネントに取り込む正しい方法は何ですか?ここで

は(簡潔にするために簡略化)私のコードです:

Ext.define('MyApp.model.Item', { 
    extend: 'Ext.data.Model', 
    config: { 
    fields: ['name', 'description', 'image'], 
    proxy: { /* proxy config */ } 
    } 
}); 

Ext.define('MyApp.view.DetailsView', { 
    extend: 'Ext.Container', 
    xtype: 'itemdetails', 

    config: { 
    layout: 'hbox', 
    items: [ 
     { 
     xtype: 'container', 
     flex: 1, 
     layout: 'vbox', 
     items: [ 
      { 
      xtype: 'img', 
      src: '' // SHOULD BE POPULATED FROM DATA.image 
      }, 
      { 
      xtype: 'button', 
      text: 'Buy', 
      action: 'buyItem' 
      } 
     ] 
     }, 
     { 
     flex: 3, 
     tpl: '<h1>{name}</h1><p>{description}</p>' // SHOULD BE POPULATED FROM DATA 
     } 
    ] 
    } 
}); 

そしてここでは、移入およびコントローラからの私の見解を示したコードです:

Ext.define('Myapp.controller.Main', { 
    ... 
    refs: { 
     itemDetails: { 
     selector: '', 
     xtype: 'itemdetails', 
     autoCreate: true 
     } 
    } 
    routes: { 
     'item/details/:id': 'showItemDetails' 
    }, 
    ... 

    showItemDetails: function(id) { 
     MyApp.model.Item.load(id, { 
     callback: function(item){ 
      var card = this.getItemDetails(); 
      card.setRecord(item); 
      this._showCard(card); 
     }, 
     scope: this 
     }); 
    } 
}); 

私が最初にシンプルでそれを実装しましたコンテナには 'tpl'が含まれていますが、この場合はコントローラの中にクエリー可能なボタンがありませんでした。何か案は?

Thx。 Ext.Component用煎茶タッチドキュメント内のコメントから撮影

答えて

0

、再帰的項目コンポーネント階層内の各アイテムでレコードを設定しsetRecords機能を追加します。その後、

setRecords: function(component, record) { 
    me = this; 
    component.getItems().each(function(item) { 
     if (typeof item.setRecord == 'function') { 
      item.setRecord(record); 
     } 

     //set record on all subitems 
     if (typeof item.getItems == 'function') { 
      var subItems = item.getItems(); 
      if (subItems.getCount() > 0) { 
       me.setRecords(item, record); 
      } 
     } 
    }); 
} 

と新しい機能を呼び出すためにsetRecordを上書き:

setRecord: function(record) { 
    result = this.callParent([record]); 
    this.setRecords(this, record); 
    return result; 
} 

ので、明示的に特定のコンポーネント

にデータを設定するために、今、これ以上の必要性
関連する問題