我见过this如此质疑。
我的代码而不是ng-bind="item.desc"
使用{{item.desc}}
,因为我之前有一个ng-repeat
。
所以我的代码是:
<div ng-repeat="item in items">
{{item.description}}
</div>
项目描述包含未呈现的新行的\n
。
假设我有上面的ng-repeat
,{{item.description}}
怎么能轻松地显示换行符呢?
发布于 2014-10-01 21:07:15
基于@pilau的答案-但有一个即使是公认的答案也没有的改进。
<div class="angular-with-newlines" ng-repeat="item in items">
{{item.description}}
</div>
/* in the css file or in a style block */
.angular-with-newlines {
white-space: pre-line;
}
这将使用给定的换行符和空格,但也会在内容边界处中断内容。有关空格属性的更多信息可以在此处找到:
https://developer.mozilla.org/en-US/docs/Web/CSS/white-space
如果您希望在换行处换行,但又不想折叠文本前面的多个空格或空白(以呈现代码或其他内容),则可以使用:
white-space: pre-wrap;
不同渲染模式的很好的对比:http://meyerweb.com/eric/css/tests/white-space.html
发布于 2016-06-08 14:38:32
使用CSS可以很容易地实现这一点。
<div ng-repeat="item in items">
<span style="white-space:pre-wrap;"> {{item.description}}</span>
</div>
也可以为此创建一个CSS类,并可从外部CSS文件中使用它
发布于 2013-10-30 22:19:36
好吧,这取决于,如果你想绑定数据,里面不应该有任何格式,否则你可以bind-html
和do description.replace(/\\n/g, '<br>')
,但不确定这是你想要的。
https://stackoverflow.com/questions/19684708
复制相似问题