Question

我需要显示带换行符的字符串。

我有对象：

"test": {
    "test1": 5,
    "test2": 6
 }

现在我需要显示以下内容：

test1 - 5
test2 - 6

所以我用：

$scope.displayString = _.keys(test).map(function(key) {
    return (key + '-' + test[key])
}).join('\n')

但是在视图上，我仍然将字符串放在一行中，例如：

test1 - 5 test2 - 6

好像我用逗号替换了一个空格，但是我想换行。我该如何解决？谢谢你的提示！

我不想使用jQuery，我想将$ scope.displayString传递给我的html（用于工具提示）。

Answer 1

$scope.displayString = _.keys(test).map(function(key) {
   return (key + '-' + test[key] + '\n')
})

或

$scope.displayString = _.keys(test).map(key => key + '-' + test[key] + '\n')

Answer 2

您必须在HTML中使用br /来换行。

Answer 3

如果显示为html，则需要添加<br>而不是\ n

$("#id1").html("test 1 "+"<br>"+" test 2");
$("#id2").html("test 1 "+"\n"+" test 2");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id1"></div>
<hr>
<div id="id2"></div>

Answer 4

使用join("<br />")代替join("\n")，并使用html()函数。

let object = {
  "test": {
    "test1": 5,
    "test2": 6
  }
}, 
text = Object.keys(object.test).map(function(key) {
  return (key + '-' + object.test[key])
}).join("<br />");

$('#showHere').html(text)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p id='showHere'>

</p>

显示带换行符的字符串

4 个答案: