Polymer: Binding to text content without escaping HTML

Created on 21 Apr 2016  Â·  4Comments  Â·  Source: Polymer/polymer

The PSK includes a list element that iterates through an array of items. Conveniently, any HTML string in the items is properly escaped when binding to text content.

Is there a way to pass down raw HTML, without escaping? A use case would be including HTML in that list, e.g.

ready: function() {
  this.items = [
    'Responsive Web App boilerplate',
    '<a href="https://github.com/PolymerElements/iron-elements">Iron Elements</a> and Paper Elements',
            ....
1.x review then close

Most helpful comment

You can do this now with <div inner-h-t-m-l="{{foo}}"></div>.

All 4 comments

This was proposed in #3362 and rejected due to security concerns.

I figured the security implications prevailed; however, nearly all template
languages provide a mechanism for HTML pass-thru, e.g. triple brace in
Mustache/Handlebars.
On Apr 21, 2016 02:37, "Tim van der Lippe" [email protected] wrote:

This was proposed in #3362 https://github.com/Polymer/polymer/pull/3362
and rejected due to security concerns.

—
You are receiving this because you authored the thread.
Reply to this email directly or view it on GitHub
https://github.com/Polymer/polymer/issues/3607#issuecomment-212831086

You can do this now with <div inner-h-t-m-l="{{foo}}"></div>.

Closing per https://github.com/Polymer/polymer/pull/3362#issuecomment-179599413 You can define your own binding parser in Polymer 2 (override _parseBindings) to define your own expressions in a base class.

Was this page helpful?
0 / 5 - 0 ratings