将 EJS 对象从后端传递到前端时保持对象的格式

【问题标题】：Keep formatting of object when passing EJS object from backend to frontend将 EJS 对象从后端传递到前端时保持对象的格式
【发布时间】：2021-10-01 08:39:29
【问题描述】：

如果这是一个非常愚蠢的问题，请原谅（我对网络开发比较陌生。）

我正在尝试将对象从后端 (NodeJS) 传递到前端 (EJS)。正在传递对象本身，但不保留格式。

NodeJS 中的对象：

console.log(project.output)

输出：

866-981-4022
639-714-6905
184.118.7634
232-097-6927
(513) 480-5802

但是，当我在 HTML/EJS 中执行此操作时：

<div> <%= detail.output %> </div>

呈现如下：

866-981-4022 639-714-6905 184.118.7634 232-097-6927 (513) 480-5802

我该如何解决这个问题？我希望它像在 NodeJS 中那样打印/渲染

【问题讨论】：

标签： html node.js ejs

【解决方案1】：

您可以将样式 white-space: pre; 添加到 div 中，以便按原样呈现新行。

<div style="white-space: pre;"> <%= detail.output %> </div>

<div style="white-space: pre;">866-981-4022
639-714-6905
184.118.7634
232-097-6927
(513) 480-5802</div>

【讨论】：

这行得通！你能否解释一下它到底做了什么以及white-space: pre 与white-space: pre-wrap 或pre-line 有何不同（简单来说）？
@SavarJ。以下是不同之处：pre - 使浏览器遵循空格，换行符，如\n &<br>。 pre-wrap - 使浏览器遵守空格、\n &<br> 等换行符和 div 的宽度。 pre-wrap - 使浏览器遵循换行符，如 \n &<br> 和 div 的宽度。