× {{alert.msg}} Never ask again
Get notified about new tutorials RECEIVE NEW TUTORIALS

How to access a known Ember component from console

Patsy Issa
Apr 14, 2015
<p>Correct me if I am wrong but it seems that you aren't using the <a href="https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi?hl=en">ember inspector</a> (available on <a href="https://addons.mozilla.org/en-us/firefox/addon/ember-inspector/">firefox</a> and as a <a href="https://github.com/emberjs/ember-inspector#bookmarklet-all-browsers">bookmarklet</a>).</p> <p>Once you have that installed it is really easy to inspect debug and modify anything ember related, for the purpose of this answer I will be using the chrome version.</p> <p>Open up your chrome dev tools in the tab that has your ember app running, once there head to the ember tab in the developer tools.</p> <p>In order to see the components you will have to tick a checkbox</p> <p><img src="http://i.stack.imgur.com/Mr51G.png" alt="enable components"></p> <p>Once enabled you will be able to see all of the components currently used.</p> <p>Clicking on a component will open up a panel that contains all of the component's properties.</p> <p><img src="http://i.stack.imgur.com/Tt8ao.png" alt="property panel"></p> <p>In order to access those properties from the console all you need to do is click on the <code>$E</code> next to the components.</p> <p>Once clicked you should see something similar in the console.</p> <pre><code>Ember Inspector ($E): Class {helperName: (...), logout: (...), isOpenBinding: StreamBinding, currentUserBinding: StreamBinding, _morph: Morph…} </code></pre> <p>Now all you need to do in order to get the property values:</p> <pre><code>$E.get('myProperty'); </code></pre> <p>And To set them:</p> <pre><code>$E.set('myProperty', newValue); </code></pre> <p>This tip was originally posted on <a href="http://stackoverflow.com/questions/28759015/How%20to%20access%20a%20known%20Ember%20component%20from%20console/29231399">Stack Overflow</a>.</p>
comments powered by Disqus