使用挖空文本创建新行

Question

我正在创建SPA。我正在使用knockout和observable数组来迭代json数组。有时我在文本中有br标签，并且使用data-bind =“text：myVar”我想要排队。问题是，br标签不起作用，因为我可以看到＆lt; br /＆gt;除了新线。我的问题是：如何使用json数据中的br标签强制knockout data-bind创建新行？我试图使用“白色空间：预包装”，但没有用。

Answer 1

您只需使用html:代替text:进行绑定，它就会处理<br />。

运行以下代码段：

＆＃13;

＆＃13;

var viewModel = {
  myVal: ko.observable('First Line <br />Second Line <br />Third Line')
};

ko.applyBindings(viewModel);

＆＃13;

* {
  font-family: Arial;
  }

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<h2>Text Binding:</h2>
<span data-bind="text: myVal"></span>
<h2>HTML Binding:</h2>
<span data-bind="html: myVal"></span>

＆＃13;

＆＃13;

＆＃13;