Emberコンポーネントの内部状態を親コンポーネントから設定する方法は？

Question

私は、いくつかの行コンポーネントを継承するテーブルコンポーネントを持っています。各行コンポーネントにはisSelectedプロパティがあります。

しばらくして、すべての行コンポーネント 'isSelectedを内部でfalseのclearアクション（ボタン）からリセットしたいとします。

どうすればこの機能を使用できますか？ データをに渡すことは、コンポーネントの内部状態を変更する唯一の方法ですか？

行コンポーネント

export default Ember.Component.extend({ 
    tagName: 'tr', 
    isSelected: false, 
    classNameBindings: ['isSelected:selected'], 

    click() { 
     const data = this.get('data'); 
     const selectedState = this.get('isSelected'); 
     this._toggleSelected(); 

     if (selectedState) { 
      this.sendAction('rowClicked', {data: data, operator: 'remove'}); 
     } else { 
      this.sendAction('rowClicked', {data: data, operator: 'add'}); 
     } 
    }, 

    _toggleSelected() { 
     this.toggleProperty('isSelected'); 
    } 
}); 

表選択コンポーネント

export default Ember.Component.extend({ 
    selectedRows: [], 
    classNames: ['table-selectable'], 

    actions: { 
     rowClicked(row) { 
      this._addToSelectedRows(row); 
     }, 

     cleanSelectedRows() { 
      this._cleanSelectedRows(); 
     } 
    }, 
    _addToSelectedRows(row) { 
     console.log(row); 
     this.get('selectedRows').addObject(row); 
    }, 
    _cleanSelectedRows() { 
     this.set('selectedRows', []); 
    } 
}); 

Answer 1

テーブルはいくつかの行で構成されています。あなたはテーブル内の行の参照を保持し、それらのパブリックメソッドを呼び出すことができます。

//row.js 

    export default Ember.Component.extend({ 
     didInsertElement(){ 
     this._super(...arguments); 
     this.get('table').registerRow(this); 
     }, 

     setSelected(selected){ 
     this.set('isSelected', selected); 
     } 
    }); 


//table.js 

    export default Ember.Component.extend({ 
     rows: Ember.computed(function(){return Ember.A();}), 
     registerRow(row){ 
     this.get('rows').pushObject(row); 
     }, 
     clearAll(){ 
     this.get('rows').forEach(function(row){ 
      row.setSelected(false); 
     }); 
     } 
    }); 


//table.hbs 

{{table-row table=this}}