「Knockout.js/applyBindings関数」の版間の差分
ナビゲーションに移動
検索に移動
imported>Administrator (ページの作成:「Knockout.jsの'''applyBindings関数'''とは、Knockout.jsをアクティブ化する(ビューモデルオブジェクトを関連付ける)もっとも...」) |
imported>Administrator |
||
10行目: | 10行目: | ||
</source> | </source> | ||
− | + | 第2引数にDOM要素を指定した場合には、そのDOM要素以下にのみビューモデルオブジェクトが関連付けられる。[[HTML]]を領域分けして、それぞれに個別のビューモデルを関連付けたい場合にはこちらを使うとよい。 | |
<source lang="javascript"> | <source lang="javascript"> | ||
ko.applyBindings(new AppViewModel(), document.getElementById('someElementId')); | ko.applyBindings(new AppViewModel(), document.getElementById('someElementId')); | ||
23行目: | 23行目: | ||
applyBindings関数を正常に動作させるにはDOMが準備されている必要がある点に注意すること。 | applyBindings関数を正常に動作させるにはDOMが準備されている必要がある点に注意すること。 | ||
− | + | HTMLのheadタグ内に書く場合は、素のブラウザ[[JavaScript]]であればonload時、[[jQuery]]であればjQuery関数に指定する[[コールバック関数]]の中で呼び出せば間違いない。 | |
<source lang="html5"> | <source lang="html5"> | ||
// jQueryでの記述例。 | // jQueryでの記述例。 | ||
32行目: | 32行目: | ||
</source> | </source> | ||
− | + | なお、[[HTML]]のbody閉じタグの直前にscriptタグを書き、その中でapplyBindings関数を呼ぶという手もある。 | |
== 関連項目 == | == 関連項目 == |
2012年4月11日 (水) 16:30時点における版
Knockout.jsのapplyBindings関数とは、Knockout.jsをアクティブ化する(ビューモデルオブジェクトを関連付ける)もっとも根幹たる関数である。
引数
- ko.applyBindings(ビューモデルオブジェクト)
- ko.applyBindings(ビューモデルオブジェクト, DOM要素)
第1引数のみを指定した場合には、全DOM要素(HTML全体)に対してビューモデルオブジェクトが関連付けられる。
ko.applyBindings(new AppViewModel());
第2引数にDOM要素を指定した場合には、そのDOM要素以下にのみビューモデルオブジェクトが関連付けられる。HTMLを領域分けして、それぞれに個別のビューモデルを関連付けたい場合にはこちらを使うとよい。
ko.applyBindings(new AppViewModel(), document.getElementById('someElementId'));
ko.applyBindings(new AppViewModel(), jQuery('#someElementId'));
戻り値
備考
applyBindings関数を正常に動作させるにはDOMが準備されている必要がある点に注意すること。
HTMLのheadタグ内に書く場合は、素のブラウザJavaScriptであればonload時、jQueryであればjQuery関数に指定するコールバック関数の中で呼び出せば間違いない。
// jQueryでの記述例。
jQuery(function() {
var AppViewModel = {};
ko.applyBindings(new AppViewModel());
});
なお、HTMLのbody閉じタグの直前にscriptタグを書き、その中でapplyBindings関数を呼ぶという手もある。