Polymer 1.0 - 如何绑定html值

时间:2015-06-06 02:22:22

标签: polymer

我有一个项目列表,其中每个项目的.content html值如下所示。

  <template is="dom-repeat" items="{{entries}}">
    <li><p class="paper-font-body2">{{item.title}}</p>
      <div>{{item.content}}</div></li>
  </template>

内容字段有点像这样

  Hello <strong>Polymer</strong>

它在浏览器中显示为纯文本。如何将其显示为安全的HTML?

编辑:此问题是raised,但它对我没有帮助。

2 个答案:

答案 0 :(得分:19)

你可以很容易地做到:

<template is="dom-repeat" items="{{entries}}">
    <li><p class="paper-font-body2">{{item.title}}</p>
      <div inner-h-t-m-l="{{item.content}}"></div></li>
  </template>

这就是我正在使用的,请记住XSS漏洞是开放的。

答案 1 :(得分:6)

您可以尝试这样的事情:

<dom-module id="echo-html">

  <template>
    <span>{{html}}</span>
  </template>

  <script>
    Polymer({
      is: 'echo-html',
      properties: {
          html: {
              type: String,
              value: 'html'
          }
      },
      ready: function() {
          this.innerHTML = this.html;
      }
    });
  </script>

</dom-module>

并称之为我猜:

<div><echo-html html="{{item.content}}"></echo-html></div>