A part of the template of my Polymer component is supposed to render unescaped HTML from a JSON response (yes, it's safe to do so in this case). I used juicy-html (https://github.com/Juicy/juicy-html) for this up until now, but it doesn't work anymore with Polymer 1.x.
The corresponding part of my template looked pretty much like this:
<template if="{{item.part1}}">
<div>
<template is="juicy-html" content="{{item.part1.part2 | callFunction}}"></template>
</div>
</template>
I read about a few solutions for injecting HTML with earlier versions of Polymer, but I'm wondering if there is a "canonical way" to achieve this with 1.x?
A slightly hack-ish way to bind a node's
innerHTML
property:Polymer infers capitalization from hyphens, translating the following character to uppercase, and when you use equals (
=
) instead of equals-dollar (=$
) Polymer binds to the node's property rather than the attribute.