ember.js: ember is not rendering polymer elements

Ember works with polymer 0.5 but not with polymer 1.0. Elements will only render if placed inside index.html, but inside any route like in application.hbs it does not render very well. The big problem is with <content></content> tags, here is an image to explain whats happening:

Inside index.html, the element is rendered and the content is going to the right place, inside this topBar div there is a <content></content> and this is where the content should go: inside-index

But in application.hbs, the content doens’t go to the right place: inside-application

This is somehow related to how ember is rendering templates because if i use the console and just insert the element with jQuery it works:

$('.ember-view').html('<paper-toolbar><div>Title</div></paper-toolbar>');

I saw this article about ember and web components, it uses the <content></content> tag as an insertion point so this should work:

http://pixelhandler.com/posts/a-bet-on-web-components-and-embercomponent-synchronicity

Would be very good to have ember working with polymer 1.0 the same way it works with 0.5.

About this issue

Original URL
State: closed
Created 9 years ago
Comments: 37 (4 by maintainers)

Most upvoted comments

Hi guys, i tried to work with ember and polymer in many ways, none of them was 100%. Best advice i have is: don’t.

Try to use ember libraries such as ember paper, ember materialize.

I decided to go with angular + angular material and im happy today 😃

matheusdavidson on Sep 13, 2016

For importing Polymer into Ember you guys can use ember-polymer. This might make the process a lot easier for some people.

dunnkers on Sep 13, 2016

Thanks @github-polymer-user. But, I still think there’s some work needed. Wrapping a Polymer component as another Polymer component doesn’t look right. And other components (paper-input and paper-button) work without wrapping.

jaichandra on Sep 13, 2016

I’ve tried in all browsers, none of them works. Depending on your config(shadow or shady dom) it will look like is working, but after you transition into routes you’ll see the same bug in all browsers!

I tried to use ember + polymer for a month with no success, i was told that polymer members are trying to create an interop to get things working but it should take some time.

matheusdavidson on Aug 3, 2015

There still seem to be some issues with some of the elements such as paper-radio-button and paper-checkbox, but I think this is an issue on the Polymer side and not Ember (see https://github.com/PolymerElements/paper-radio-button/issues/26).

steven-ferguson on Aug 3, 2015