既存のDOM要素をKnockoutJSビューモデルにバインドする方法

Question

JS値が変更された場合（ノックアウトがこの機能を提供する）、KnockoutJSを使用してDOMを更新しています。

デフォルトノックアウトViewModelには、次のブロックのようなものになります。今、価格の変更は、ビューは自動的にノックアウトによって更新されたときに

<span data-bind="text: price"></span> 

：

Javascriptを：

var viewModel = { 
    price: ko.observable(109) 
} 

のHTMLを.. しかし、私は次のものを持っています：

var viewModel = { 
    price: ko.observable(jQuery("#price")) 
} 

<span id="price">99.00</span> 

DOM要素をmy viewModelにバインドします。モデルのprice属性は99.00の値で初期化されます。価格が（Javascriptで）変更されると、#priceのDOM値も更新する必要があります。

私は質問が皆さんにはっきりしていることを願っています。

ありがとうございました！

Answer 1

あなたのビューモデルを初期化する必要があります。だから、代わりに：

jQuery("#price").text('some new value'); 

..あなたが書いされなければならない...

viewModel.price('some new value'); 

このアプローチはMVVMパターンに合わせて、より多くのだろう。

Answer 2

これは、あなたが価格を変更たびに更新されます依存に観察

var viewModel = { 
    price: ko.observable(109) 
} 

viewModel.priceElement= ko.dependantObservable(function(){ 
    viewModel.price(); 
    return jQuery("#price"); 
}) 

を使用してみてください。あなたはモデルではなく、ビューを更新するにはJavaScriptを使用してすべきことであるが、後

var viewModel = { 
    price: ko.observable(jQuery("#price").text()) 
} 

<span id="price" data-bind="text: price">99.00</span> 

を次のように