html - SPAN 中的新行

标签 html css angular line

我从 API 返回以下示例值并将其绑定(bind)到 span 元素中。我想要实现的是将每个 Unit 保留在单独的新行中/

"Unit1-Employee1 , Unit2- Employee 2, Unit3- Employee 3,Employee 4"

我尝试在 API 中的每个单元之前附加 \n 并将其绑定(bind)到 span,但它没有从新行开始。

最佳答案

试试这段代码。

const string = "Unit1-Employee1 , Unit2- Employee 2, Unit3- Employee 3,Employee 4";
const array = string.split(",");

在 HTML 中:

<span *ngFor="let data of array">
  {{data}} <br>
</span>

演示链接:https://stackblitz.com/edit/angular-5ylntb

关于html - SPAN 中的新行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59465465/

相关文章:

dart - 使用 angular2 注入(inject) Dart 单例

css - 覆盖多个 LESS 文件中的变量

Angular 2/4 如何设计 Angular Material 设计 snackbar 的样式

angular - 使用 primeng p-tree 组件停止节点删除事件

html - 为什么 "Source Sans Pro"在 Chrome 中以不正确的字体粗细显示为 "font-weight:200"?

javascript - 如何在滑动时在 Twitter Bootstrap 中自动定位 sidenav

html - CSS 内容属性在 MSIE 中不起作用?

javascript - Quicktime 视频 : Hide Controls and get current play time

javascript - 如何让图片扩展到整个背景?

html - 如果在 html5 中提供了无效的电子邮件,如何提供符合 i18n 的验证消息