集成iCanHaz和Marionette

问题描述：

我是ICanHaz的忠实粉丝，我试图直接将它整合到我正在构建的新的Marionette应用程序中。然而，去关this post，我写了这个到达到渲染方法，并改变它的提线木偶：集成iCanHaz和Marionette

// Set up Initalizer 
    APP.addInitializer(function() { 

     //Reach into Marionette and switch out templating system to ICH 
     Backbone.Marionette.Renderer.render = function(template, data){ 
      return ich[template](data); 
     } 

     //Create Router 
     new APP.Routers.GlobalRouter(); 

     //Start Backbone History 
     Backbone.history.start(); 

    });

如果我走通过这个功能，所有的数据似乎正常工作。但是，当投入使用并试图将其用于布局和项目视图时，没有任何内容被添加或插入。这是来自我的GlobalRouter：

//Grab the main Layout 
     var layout = new APP.Views.LayoutView(); 

     //Render that layout 
     layout.render(); 


     //Make the model 
     var userModel = new APP.Models.UserModel({ 
      "user_name" : "[email protected]", 
      "tenant" : "Ginger Ale is Great" 
     }); 

     //Make the Header Region 
     var headerRegion = new APP.Views.HeaderView({model: userModel}); 
     layout.header.show(headerRegion);

这一切都发生在索引被命中时调用的方法中。没有JS错误，所以我没有什么可继续。然而，它在渲染函数中追加数据到正文，它会添加（但是破坏我的布局和区域结构）。

我在index.html中存储我的模板。

任何人都可以帮忙吗？

答

好吧，我找不到使用ICH的简单方法。但是，由于我发现了另一个SO，使用Mustache可以找到非常类似的功能。

使用此代码：

Backbone.Marionette.TemplateCache.prototype.compileTemplate = function(rawTemplate) { 
    return Mustache.compile(rawTemplate); 
}

允许您更改呈现，因此您可以从index.html的使用木偶的模板调用胡子拉模板。胡须模板看起来是这样的：

<script id="headerTemplate" type="text/template"> 
     <p>{{user_name}}</p> 
     <p>{{tenant}}</p> 
    </script>

不同的是，该类型是“文本/模板”，而不是“text/html的”。否则它的行为非常相似。

希望这可以帮助别人。

集成iCanHaz和Marionette

相关推荐