data - Knockout.js carraige return en el texto del párrafo

ko js attr

Question

Usando knockout.js, ¿cómo incluyo un retorno de carro en el texto que está vinculado al atributo de texto de un elemento de párrafo <p> .

En mi ViewModel generé una cadena de texto que está vinculada a la <p> en la Vista. Deseo incluir retornos de carro en la cadena que muestra el navegador con los saltos de línea.

Incluir <br /> o Environment.NewLine en la cadena no parece funcionar.

Answer 1

Necesita establecer una propiedad css en su elemento. 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());

Entonces el código funciona. con /n

Answer 2

Puede usar el enlace html .

JS:

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

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

Vista:

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

Ver violín

Answer 3

También puede usar tramos para obtener sus enlaces y luego el html será el habitual.

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