段落テキストの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はいつものようになります。