是否有一种方法可以防止Polymer表达式中的HTML转义？ [英] Is there the a way to prevent HTML escaping inside a Polymer expression?

问题描述

我的同事Patrick&我目前正在将一个自动完成组件从Web UI转换为Polymer.dart.In Web UI中，我们提供了一个HTML呈现列表到自动完成，以给程序员机会样式的结果。根据输入的值，我们过滤列表并显示匹配结果。

My colleague Patrick & I currently converting an autocomplete component from Web UI to Polymer.dart.In Web UI we provided a HTML rendered list to the autocomplete in order to give a programmer the opportunity to style the results. Based on the input's value we filtered the list and displayed the matching results.

您会推荐在Polymer.dart中实现相同的行为？

What would you recommend to achieve the same behaviour in Polymer.dart? Should we approach this completly differently?

旧Web UI代码：

<template iterate="entry in filteredEntries">
  <li class="b-autocomplete-results-li">{{ entry.sanitizedHtml }}</li>
</template>

一个条目的类：

class AutocompleteEntry {

  final String id;
  final String searchableText;
  final Element _element;

  AutocompleteEntry(this.id, this.searchableText, this._element) {
    // remove the data-id and data-text since we don't need them in the html
    _element.dataset.remove('text');
    _element.dataset.remove('id');
  }

  get sanitizedHtml {
    var validator = new NodeValidatorBuilder()..allowHtml5();
    var documentFragment = document.body.createFragment(_element.outerHtml, validator: validator);
    return documentFragment;
  }
}

推荐答案

strong>更新

Update

Dart Polymer 1.0的即用型元素是 bwu-bind-html

A ready-to-use element for Dart Polymer 1.0 is bwu-bind-html

这是有意的，因为它容易发生XSS攻击。
您可以做的是使用< safe-html> 的元素。

No there isn't. This is intentional because it is prone to XSS attacks. What you can do is to use an element like <safe-html> instead.

我对此问题的回答国际化字符串中的HTML标记在Polymer.dart 中显示了完整的源代码。

My answer to this question HTML Tags Within Internationalized Strings In Polymer.dart shows the full source code.

这篇关于是否有一种方法可以防止Polymer表达式中的HTML转义？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！