外部模板和使用Knockout和RequireJS的「el」？

我想使用Knockout ViewModels作爲自包含的「小部件」，可以放入頁面上的任何（或多個）DOM節點。我在Backbone有一個方法，似乎工作得很好，我試圖將該概念轉換爲Knockout。外部模板和使用Knockout和RequireJS的「el」？

骨幹視圖，我會做這樣的事情，使用RequireJS文本插件拉模板，並將其注入到EL：

define(['text!templates/myTemplate.html',], function(templateHTML){ 
    var view = Backbone.View.extend({ 

     initialize:function() { 
      // yes I know the underscore templating stuff doesn't apply in Knockout 
      this.template = _.template(templateHTML); 
      this.render(); 
     }, 

     render:function() { 
      // the $el is provided by external code. See next snippet 
      this.$el.append(this.template(myData)); 
      return this; 
     } 

     // other view behavior here 

    }); 

    return view; 
});

然後其他一些部件的外部代碼可以放置該視圖成現有的DOM節點：

new MyBackboneView({el: $('#myExistingDivID')});

在淘汰賽中，我能找到這種方法最接近的是讓外部代碼使用文本插件拉模板，將其注入格，然後應用KO綁定：

var mydiv = $('#myExistingDivID'); 
mydiv.html(myTemplateHTML); 
ko.applyBindings(new MyKOViewModel(), mydiv[0]);

1 - 有沒有在淘汰賽的推薦辦法有視圖模型本身注入基於骨幹的「厄爾尼諾」的概念等同外部HTML模板？關鍵是外部（router-ish）代碼控制着，其中內容將被放置，但ViewModel控制內容的實際細節以及獲取模板的位置。

2 - 如果是，應該我採用這種方法，還是濫用了Knockout和MVVM的使用方式？

來源

2013-03-16 explunit

我不是淘汰賽專家引擎像

var stringTemplateEngine = new ko.nativeTemplateEngine(); stringTemplateEngine.makeTemplateSource = function (template) { return new StringTemplateSource(template); }; ko.setTemplateEngine(stringTemplateEngine);

簡單的例子，但我相信你是對的第2點。基因敲除的視圖是html代碼，通常從內部具有'data-binding'屬性的服務器返回。它不像Backbone.View那樣從模板創建。 – 2013-03-16 16:58:43

您可以覆蓋默認模板源，然後使用具有默認渲染我做

http://jsfiddle.net/3CQGT/

來源

2013-03-16 19:25:41 Anders

如果我正確理解你的例子，外部代碼仍然提供模板（就像我的例子）。相反，我試圖讓ViewModel本身提供模板並將其注入到由外部代碼提供的位置（例如，除了id之外沒有其他標記的空div）。再次，一個類似小部件的方法。如果我誤解了你的例子，請告訴我。 – explunit 2013-03-16 19:59:51

是否這樣？ http://jsfiddle.net/3CQGT/1/ – Anders 2013-03-16 20:06:06

如果您將我的上述解決方案與我的Convention over配置庫結合使用，您可以在抽象視圖模型和視圖的位置獲得真正乾淨的解決方案。看這裏https://github.com/AndersMalmgren/Knockout.BindingConventions/wiki/Template-convention – Anders 2013-03-19 08:00:30

外部模板和使用Knockout和RequireJS的「el」？

回答

相關問題