如何在聚合物元素定义中分配 HTML 实体

Question

>替代问题版本：在聚合物元素定义中添加时，如何防止HTML实体被转义？

因此，假设这个简化的示例（所有包含的聚合物库都添加到实际代码中）：

元素定义

<polymer-element name="x-test" attributes="val">
  <template>
    <div>{{shownVal}}</div>
  </template>
  <script>
    Polymer( 'x-test', {
      shownVal: '',
      valChanged: function(){
        this.shownVal = this.val + ' &amp;';
      }
  });
  </script>
</polymer-element>

元素用法

<x-test val="123"></x-test>

这将导致如下输出：

123 和

版本： 聚合物 0.1.2

我需要更改/添加什么才能获得像123 &这样的输出？

或者这是某种错误，我应该让聚合物的人知道？

我知道，我可以在<template>中添加实体，这将起作用，但我有一些代码，可以修改输入属性并需要使用实体。

---

注意：如果像这样使用元素

<x-test val="123 &amp;"></x-test>

一切都很好。

Answer 1

有几种方法可以做到这一点：

• 自定义筛选器（尚未记录）

  encodeEntities: function(value) {
    var div = document.createElement('div');
    div.innerHTML = this.shownVal;
    return div.innerHTML;
   }
  

• 使用自动节点查找并设置某些容器的.innerHTML。

  this.$.container.innerHTML = this.shownVal;
  

演示显示这两个： http://jsbin.com/uDAfOXIK/2/edit