私が使用してアプリケーションを開発しています - 1. Knockout.js 2. Knockout.js外部テンプレートエンジンを(ifandelse)、 3、サミーJS [間接的に注入器、TrafficCopのを使用して] 、Require JSなど。複数ページあたりのビューモデルとロードテンプレート非同期
モジュール性と開発の容易さを促進するため、ページあたり複数のビューモデルを使用するようにアプリケーションを設計しています。オーバーロードされたバージョンのapplyBindingを使用して複数のビューモデルをバインドする方法について説明しているRyan Niemeyer(http://www.knockmeout.net/2012/05/quick-tip-skip-binding.html)のバインディングヒントを使用します。このテクニックは、Jim CowartのKnockout.js External Template Engineライブラリを使用することになり、テンプレートをファイルに分けて非同期にロードするのに役立ちました。それがうまくいかない理由は、特定のDOM要素にviewmodelをバインドするapplyBindingです。DOM要素が存在する必要があります(テンプレートがKO外部テンプレートエンジンによって非同期に要求され、ロードされている場合はそうではありません)。私はafterRenderなどを使うことはできません。
誰もがこのシナリオに遭遇しましたか?この点に関する提案、方向性は非常に役立ちます。私は使用できるKOのいくつかの機能が欠けていますか? HTMLテンプレートを定義しながら、今のところ
は、回避策として、私は 'templateLoaded' コールバックを追加しました:
<!--ko template: {name: 'header', templateUrl: '/templates/shell', templateLoaded: function() { header.bindViewModel.call(header) }} -->
<!--/ko-->
HTMLテンプレート:
<!-- ko stopBinding: true -->
<header id="divHeader">
<!-- Template Code using Header viewmodel -->
</header>
<!-- /ko -->
ヘッダーのviewmodel:
bindViewModel = function() {
ko.applyBindings(this, $("#divHeader").get(0));
}
を
とKnockout.jsメソッドexecuteTemplate()を次のように変更しました。
if (haveAddedNodesToParent) {
if (options.templateLoaded) {
options.templateLoaded.call(bindingContext['$data']);
}
activateBindingsOnContinuousNodeArray(renderedNodesArray, bindingContext);
if (options['afterRender'])
ko.dependencyDetection.ignore(options['afterRender'], null, [renderedNodesArray, bindingContext['$data']]);
}
テンプレートが非同期に取得され、解析され、DOMに読み込まれた後で、コールバックが呼び出されます。これは、viewmodelを正しい要素にバインドするのに役立ちます。私は私の仕事でMVC4であなたと同じアーキテクチャを使用してい
あなたがメニューの読み込みを終え、サーバーに要求したビューモデルにテンプレートを適用すると、交通警官のおかげで、テンプレートをサーバーに要求できますあまりにも! – deividsito