我绑定了一个带换行符的字符串，比如模型中的'Hello\nWorld'。现在我想使用{{x}}在我的模板中显示值。但是没有正确显示换行符。聚合物是否为输出<br>换行提供了支持？
答案 0 :(得分：3)
现在，您最好的选择是创建Nl2br PolymerElement。您可以添加标记的唯一位置是在模板内部，因此您需要一个模板来拆分字符串并添加<br /> s
示例：
<nl2br-element text="{{}}"></nl2br-element>
<强> nl2br.dart
library nl2br;
import "dart:html";
import 'package:polymer/polymer.dart';
import "package:polymer_expressions/polymer_expressions.dart";
@CustomTag('nl2br-element')
class Nl2brElement extends PolymerElement with ObservableMixin {
@observable String text;
DocumentFragment instanceTemplate(Element template) =>
template.createInstance(this,
new PolymerExpressions(globals: {
'splitnewline': (String input) => input.split("\n")
}));
}
<强> nl2br.html
<polymer-element name="nl2br-element" attributes="text">
<template>
<template repeat="{{line in text | splitnewline}}">
{{line}}<br />
</template>
</template>
<script type="application/dart" src="nl2br.dart"></script>
</polymer-element>
<强> nl2br_test.html
<!DOCTYPE html>
<html>
<head>
<link rel="import" href="nl2br.html">
<script src="packages/polymer/boot.js"></script>
</head>
<body>
<template id="nl2br" bind>
<nl2br-element text="{{}}"></nl2br-element>
</template>
<script type="application/dart" src="nl2br_test.dart"></script>
</body>
</html>
<强> nl2br_test.dart
library nl2br_test;
import 'dart:html';
main() {
query("#nl2br").model = "foo\nbar";
}
您可以创建一个聚合物表达式，将\n替换为<br />。
现在，聚合物消毒了所有的HTML，如果没有DOM操作，你就无法绕过它。由于它会使<br /> html安全，foo\nbar将在页面上显示foo<br />bar，而不会显示换行符。 这意味着这不会完全符合您的要求，但如果聚合物添加了一种在页面上显示安全html的方法，那么这将是最佳选择。
library nl2br_mixin;
import "dart:html";
import "package:polymer_expressions/polymer_expressions.dart";
class Nl2brMixin {
DocumentFragment instanceTemplate(Element template) =>
template.createInstance(this,
new PolymerExpressions(globals: {
'nl2br': (String input) => input.replaceAll("\n", "<br />")
}));
}
您可以将此mixin与您的PolymerElement
一起使用class CustomElement extends PolymerElement with ObservableMixin, Nl2brMixin {
@observable
String text = "foo\nbar";
}
在模板中使用nl2br表达式
{{text | nl2br}}
现在，这可能不是在您的自定义元素中获取nl2br表达式而不将其明确地放入您的类中的最佳方法。如果您有多个mixin声明instanceTemplate或在您的班级中声明它，则只有其中一个可以使用。