Question

我创建了一个显示地址的Polymer元素。对于新行，地址包含\n，因此我想将其替换为<br/>。

这是模板：

 <br/>
  {{sanitizeAddress(address)}}
 <br/>

这是sanitizeAddress的代码：

 sanitizeAddress: function(unsanitizedAddress) {
      var sanitizedAddr = unsanitizedAddress.replace("\n","<br/>");
      console.log("sanitizedAddr = " + sanitizedAddr);
      return sanitizedAddr;
 }

这是实际输出：

FIRSTLINE，＆LT峰; br /＆GT;二线

这是预期的输出：

FIRSTLINE，
二线

如何让<br/>消失并显示新行？

Answer 1

默认情况下，Polymer会自动调整绑定中的HTML内容，以防止您意外地结束您不想要的DOM更改。一种简单的方法是为某个元素分配id，然后在数据可用时以这种方式插入：

<dom-module id="my-element">
  <template>
    <div id="addressContainer"></div>
  </template>
  <script>
    Polymer({
      is: 'my-element',
      properties: {
        address: {
          type: String,
          observer: '_addressChanged'
        }
      },

      _addressChanged: function(newValue) {
        this.$.addressContainer.innerHTML = newValue;
      }
    });
  </script>
</dom-module>

请注意，只对您信任的HTML执行此操作。

聚合物显示而不是新线

1 个答案: