Programatically create component

I want to add a component programatically and append that after a target element.

something like this:

let comp = SomeComponent.create({ item: item });

comp.insertAfter(‘#someExistingComponentId’);

but this is not working.

Ember.$(comp.element).insertAfter(‘#someExistingComponentId’);

neither is that

any ideas? thanks

Are you using ember cli? You can do ember g component my-component. Maybe you can explain a bit more what you are doing.

maybe you can add logic on the template itself. If something else view my-component…

Generally it isn’t that easy to. Can you give us a few more details on what you are trying to do so we can make other suggestions?

Let’s say you have a parent TopLevelComponent. Ember has a hook didRender() you can utilize. Inside there you can trigger a flag that tells childComponent to render.

// top-level.hbs {{#if targetElementExists}} {{childComponent}} {{/if}}

//top-level.js

export default Ember.Component.extend({
targetElementExists: false, didRender(){ this.set(‘targetElementExists’, true) } });

1 Like