2013-12-13 6 views
5

カスタムビューロケーション戦略を使用する方法を理解しようとしていますが、このページのドキュメントhttp://durandaljs.com/documentation/Using-Composition/を読んでいますが、戦略機能の外観を正確に理解できません。Durandalカスタムビューロケーションストラテジー

この関数の実装がどのようなものか、返すという約束(簡単なものさえ)などの簡単な例を誰にでも教えてもらえますか?事前に

おかげで、 ゲイリー

P.S.プロパティを読み取ることができません '表示':これが私のHTMLのコードです:

<div> 
    <div data-bind="compose: {model: 'viewmodels/childRouter/first/simpleModel', strategy: 
'viewmodels/childRouter/first/myCustomViewStrategy'}"></div> </div> 

をし、これが私のmyCustomViewStrategyのコードです:

define(function() { 

    var myCustomViewStrategy = function() { 

     var deferred = $.Deferred(); 

     deferred.done(function() { console.log('done'); return 'simpleModelView'; }); 
     deferred.fail(function() { console.log('error'); }); 

     setTimeout(function() { deferred.resolve('done'); }, 5000); 

     return deferred.promise(); 
    }; 

return myCustomViewStrategy; 
}); 

が、私はエラーを取得:

キャッチされない例外TypeErrorをundefinedの - これはdoneの後にコンソールウィンドウに記録されています。

+0

P.S.私はむしろ誰かが正しい方向に私を指すことができれば、私は感謝するだろうので、理解することによって学ぶだろう。 –

答えて

1

わかりました、私は次のようで、私のカスタムビュー戦略を作成することによって、これを解決:

define(['durandal/system', 'durandal/viewEngine'], function (system, viewEngine) { 

    var myCustomViewStrategy = function() { 
     return viewEngine.createView('views/childRouter/first/sModelView'); 
    } 

    return myCustomViewStrategy; 

}); 
1

私はそれがどのように動作するか、ソースコードを確認ビットがコンの結合戦略の設定に欠けているドキュメントを見つけたよう。それをSUMMするには:

をそのモジュールID

  • によってコンの結合ストラテジ設定で指定されたモジュールが拘束されることに鑑み、その結果の約束を返すの戦略 "
  • という名前の関数を返す必要があります
  • をHTML要素オブジェクトとして定義します。
  • ストラテジメソッドは、コンフィグレーションバインディングの設定オブジェクト
  • を受け取り、モデルオブジェクトはすでに解決されています。

作業例:

define(['durandal/system', 'durandal/viewEngine'], function (system, viewEngine) { 

    var strategy = function(settings){ 
     var viewid = null; 
     if(settings.model){ 
      // replaces model's module id's last segment ('/viewmodel') with '/view' 
      viewid = settings.model.__moduleId__.replace(/\/[^\/]*$/, '/view'); 
     } 
     return viewEngine.createView(viewid); 
    }; 

    return strategy; 
}); 

デュランダルのソース:

// composition.js:485 

for (var attrName in settings) { 
    if (ko.utils.arrayIndexOf(bindableSettings, attrName) != -1) { 
     /* 
     * strategy is unwrapped 
     */ 
     settings[attrName] = ko.utils.unwrapObservable(settings[attrName]); 
    } else { 
     settings[attrName] = settings[attrName]; 
    } 
} 

// composition.js:523 

if (system.isString(context.strategy)) { 
    /* 
    * strategy is loaded 
    */ 
    system.acquire(context.strategy).then(function (strategy) { 
     context.strategy = strategy; 
     composition.executeStrategy(context); 
    }).fail(function(err){ 
     system.error('Failed to load view strategy (' + context.strategy + '). Details: ' + err.message); 
    }); 
} else { 
    this.executeStrategy(context); 
} 

// composition.js:501 

executeStrategy: function (context) { 
    /* 
    * strategy is executed 
    * expected to be a promise 
    * which returns the view to be bound and inserted to the DOM 
    */ 
    context.strategy(context).then(function (child) { 
     composition.bindAndShow(child, context); 
    }); 
} 
関連する問題