Knockout.js 단락 텍스트에서의 반환

Question

knockout.js를 사용하면 단락 <p> 요소의 텍스트 특성에 바인딩 된 텍스트에 캐리지 리턴을 어떻게 포함시킬 수 있습니까?

내 ViewModel에서보기의 <p>에 바인딩 된 일련의 텍스트를 생성했습니다. 브라우저가 줄 바꿈과 함께 표시하는 문자열에 캐리지 리턴을 포함하고자합니다.

문자열에 <br /> 또는 Environment.NewLine을 포함하면 작동하지 않는 것 같습니다.

Answer 1

html binding을 사용할 수 있습니다.

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> 

See fiddle

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

당신은 또한 당신의 바인딩을 얻기 위해 스팬을 사용할 수있는 다음 HTML은 평소와 같이 될 것입니다.

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