Extend Ember component without changing template [closed]

Question

I have an Ember application and want to extend a component to override some functionality, but don't want to change or duplicate the template.

However, if I just import and extend the component, nothing is rendered.

How can I make my extended component render using the template that I extended from?

Answer 1

Thanks to the question answered here How can I share a template between two components using Ember CLI? I was able to add a layoutName to the child component pointing to the parent template and solved my problem. My code finally looks like this:

import Ember from 'ember';
import ExtendFromComponent from './extend-from';

export default ExtendFromComponent.extend({
  layoutName: 'components/extend-from'
});

Answer 2

You must have done something wrong. In Ember 2.0.0 you can create a component which extends from another component(and shares its template) using following ES6 syntax in components/second-component:

import Ember from 'ember';
import ExtendFromComponent from './extend-from';

export default ExtendFromComponent.extend({
  // ...
});

It renders fine with template and properties of first component. If you still can't get it right then please add your code to question.