整合iCanHaz和木偶 [英] Integrating iCanHaz and Marionette

问题描述

我ICanHaz的忠实粉丝，我试图直接intregrate到一个新的应用程序木偶我建立。然而，去了这个帖子，我写了这个到达到渲染方法，并改变它在木偶：

I'm a big fan of ICanHaz, and I'm trying to directly intregrate it into a new Marionette application I'm building. However, going off this post, I have written this that reaches into the render method and changes it in 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：

If I walk through this function, all the data seems to work fine. However, when put into use and trying to use it for layouts and Item Views, nothing gets appended or inserted. This is from my 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" : "[e-mail]",
          "tenant" : "Ginger Ale is Great"
        });

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

这一切都发生在一个索引时被击中被调用的方法。有没有JS错误，所以我没有去。然而，它在渲染功能，我将数据追加到体内，它会增加（但是毁了我的布局和区域结构）。

This all happens in a method that gets called when index is hit. There are no JS errors so I have nothing to go on. However, it in the render function I append the data to the body, it will add (however ruining my layout and region structure).

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

I am storing my templates in index.html.

任何人都可以在这方面帮助？

Can anyone help with this?

推荐答案

好吧，我找不到一个简单的方法来做到这一点使用ICH。然而，由于其他SO，我发现非常类似的功能，可以只用胡子找到。

Okay, I couldn't find an easy way to do this using ICH. However, due to another SO I found, very similar functionality can be found just using Mustache.

使用这个code：

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

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

Lets you change the renderer so you can pull mustache templates from index.html using Marionette's template call. A mustache template looks like this:

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

不同的是，该类型是文本/模板，而不是文本/ html。否则，它的作用非常相似。

The difference is that the type is 'text/template' as opposed to 'text/html'. Otherwise it acts very similar.

希望这可以帮助其他人。

Hope this helps someone else.

这篇关于整合iCanHaz和木偶的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！