CODEWITHSUNDEEP
ember.jsember-components
Prakash Raman
Prakash Raman

Reputation: 13933

Access the instance of the component from parent component in EmberJS

I have a "container" component

# components/container-component.js

import Ember from 'ember';
export default Ember.Component.extend({
  displayComponent: 'simple-box'
});

The template is

# templates/container-component.hbs

<div>
  {{component displayComponent}}
</div>

Now, from within "container-component" instance. How can I access the computed "displayComponent" instance?

Any ideas on how I could go about it?

When I use the get method I get the string identification of the component

this.get('displayComponent') 
# returns (String) 'simple-box'

Upvotes: 2

Views: 2887

Answers (1)

feanor07
feanor07

Reputation: 3368

There is not a built-in way of retrieving children components from the parent component's js file as far as I know. If you really want to achieve this, please refer to my twiddle I have prepared for you.

As you can see from the code; within the template parent passes itself to the child and child registers itself to the parent. Note that this is an illustration of code smell and this is something I never use in my projects.

Because, in my opinion what you are trying to achieve is a clear violation of many principles that ember is built upon. Why do you want to get the child property from the parent directly? You can register actions to child component and get notified for various events within the child component. Why do you need direct access? It is better for a component to be working independently by itself. In this kind of approach you are polluting parent's code with child component's internal design considerations. You can query DOM tree via jquery within parent but getting the child component instance created for you by Ember infrastructure is a sign that you are trying to design something that is out of Ember's approach. We can help you better if you post another question (or modify this one) to describe your intention. May be someone could lead you to a better design. Best Regards.

Upvotes: 7

Related Questions