我怎样才能保留AngularJS部分中的新行？

在一个AngularJS部分中，我正在循环一个条目列表，如下所示：

<ul class="entries"> <li ng-repeat="entry in entries"> <strong>{{ entry.title }}</strong> <p>{{ entry.content }}</p> </li> </ul> 

{{entry.content}}有一些被AngularJS忽略的换行符。 我怎样才能让它保持linebreaks？

Answer 1

这只是基本的HTML。 AngularJS不会改变任何事情。 你可以使用pre标签来代替：

 <pre>{{ entry.content }}</pre> 

或者使用CSS：

 p .content {white-space: pre} ... <p class='content'>{{ entry.content }}</p> 

如果entry.content包含HTML代码，则可以使用ng-bind-html ：

 <p ng-bind-html="entry.content"></p> 

不要忘记包括ngSanitize ：

 var myModule = angular.module('myModule', ['ngSanitize']); 

Answer 2

我做filter

 // filters js myApp.filter("nl2br", function($filter) { return function(data) { if (!data) return data; return data.replace(/\n\r?/g, '<br />'); }; }); 

然后

 // view <div ng-bind-html="article.description | nl2br"></div> 

Answer 3

我通过添加pre-line修复它：

 <style> pre{ white-space: pre-line; } </style> My data: <pre>{{feedback.Content}}<pre> 

Answer 4

 // AngularJS filter angular.module('app').filter('newline', function($sce) { return function(text) { text = text.replace(/\n/g, '<br />'); return $sce.trustAsHtml(text); } }); // HTML <span ng-bind-html="someText | newline"></span>