如何在AngularDart中用新行显示一个字符串作为字符串？

Question

鉴于我在AngularDart页面上显示了一个字符串。

... <strong>Notes: </strong> {{cmp.selectedStudent.notes}} ...

如何让它显示多行？在字符串中我有换行符，我希望它们在html输出中被编码为<br />个字符。

Answer 1

您可以使用'\n'替换字符串中的<br/>，并使用我在此处How to add a component programatically in Angular.Dart?中显示的建议my-bind-html指令（代码可能有点）由于最近Angular的很多变化而过时了）

您可以使用ng-repeat并重复注释行，但首先需要按'\n'拆分它们，以便获得一系列行。

List<String> _notesList = null; 
List<String> get notesList { 
  if (_notesList==null) _notesList = notes.split("\n").toList(); return _notesList; 
} 

<span ng-repeat="note in cmp.selectedStudent.notesList">{{note}}<br /></span>

Answer 2

默认情况下，angular不会解释HTML应答以避免某些不可预测的行为或其他不良内容，但您可以使用

禁用此验证

  

纳克绑定-HTML

链接到官方文档：NgHtmlBind

所以你可以直接替换＆＃39; \ n＆＃39; ＆＃39; br＆＃39; html节点。

所以你可以这样做：

// ...
String getHtmlBrNote() {
  return this.notes.replaceAll("\n", "<br />");
}
// ...

之后以角度

... <strong>Notes: </strong> <span ng-bind-html="cmp.selectedStudent.getHtmlBrNote()"></span> ...

没关系