Get Ember Component Name

Question

If I call Ember.inspect(component) , I get a response like:

 < app@component :my-component::ember1246> 

This means that the component knows its name ( my-component ). Is there any way to access this name?

Answer 1

Ember.inspect() calls toString() objects, which in turn call some internal metal properties to get the name.

However, there is an internal property that people used to get the name:

 this.__proto__._debugContainerKey 

This outputs component:my-component , then you can simply split by : There will be a problem that will create a publicly available way to expose the object’s meta-information, which we will be able to use in the future: https://github.com/emberjs/ember.js/issues/10742 p>

Answer 2

This regex will do the trick:

 //Returns a string with full name of component, like: < ProjectName@component :path/to/component-name::ember793> let componentName = this.toString (); //This regex will match the component and capture the latest part of component path. let regex = componentName.match (/<[a-zA-Z] +@ [a-zA-Z]+:(?:[az]+[\/])*([-az]+)::[a-zA-Z]+[0-9]+>/); //The latest element of array is the component name. console.log (regex[regex.length-1]); //component-name 

For more details on how this works, see https://regex101.com/r/rX9bQ7/3 .