Knockout.js Carraige вернуться в текст параграфа

Question

Используя knockout.js, как включить возврат каретки в текст, связанный с текстовым атрибутом абзаца <p> элемент.

В моей ViewModel я сгенерировал строку текста, которая привязана к <p> в представлении. Я хочу включить возврат каретки в строку, которую браузер отображает с разрывами строки.

В том числе <br /> или же Environment.NewLine в строке похоже не работает.

Answer 1

Вы можете использовать HTML-привязку.

JS:

function AppViewModel() {
    this.firstName = "Bert<br\>Test";
    this.lastName = "Bertington";
}

// Activates knockout.js
ko.applyBindings(new AppViewModel());

Посмотреть:

<p>First name: <strong data-bind="html: firstName">todo</strong></p>
<p>Last name: <strong>todo</strong></p>

Смотри скрипку

Answer 2

Вам необходимо установить свойство css в вашем элементе. white-space: pre-wrap

<p style="white-space: pre-wrap">First name: <strong data-bind="text: firstName">todo</strong></p>
<p>Last name: <strong>todo</strong></p>

function AppViewModel() {
    this.firstName = "Bert" + " \n " + "Test";
    this.lastName = "Bertington";
}

// Activates knockout.js
ko.applyBindings(new AppViewModel());

Тогда код работает. с \n

Answer 3

Вы также можете использовать span, чтобы получить ваши привязки, и тогда HTML будет как обычно.

<span data-bind="text: firstName"></span><br /><span data-bind="text: lastName"></span>