Change default delimiters in ember.js
Asked Answered
B

3

5

(This question is related to this one)

I have a web2py application which I want to extend with some ember.js code. The delimiters of the templating systems in web2py and ember.js conflict (both are {{ and }}). Since my application has no ember.js legacy, I would like to write the ember.js code using a different delimiter. Is this possible?

Brause answered 26/8, 2012 at 18:52 Comment(0)
C
4

The template engine use by ember.js is Handlebars.js, and I don't think you can change the delimiter. I've seen the other question, and perhaps an other answer could be found here : Handlebars.js in Django templates

Clear answered 26/8, 2012 at 22:58 Comment(2)
Thanks. Since ember.js in inflexible in this regard, and web2py is configurable, I am forced to change the default delimiters in web2py, and process all my view files.Brause
What a pity, I thought you could do the same as in this answer about django, ie defining a kind of block delimeters where you can put handlebars templates. So you would'nt have to change your actual files... :(Clear
L
3

In web2py: response.delimiters = ('[[',']]')

Lozada answered 27/8, 2012 at 19:46 Comment(1)
Thanks Massimo, that's what I did.Brause
W
1

If you don't want to change any delimiters (on web2py or in handlebars) you can do it by saving the handlebars template in an external file like people.hbs in the web2py /static/ folder for example

{{#each people}}
<div class="person">
    <h2>{{first_name}} {{last_name}}</h2>
</div>
{{/each}}

And in the view import that file using jQuery load() function.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="https://raw.github.com/wycats/handlebars.js/master/dist/handlebars.js"></script>    

<div id="list"></div>
<script id="people-template" type="text/x-handlebars-template"></script>

<script type="text/javascript">
$('#people-template').load('/static/people.hbs', function() {
    var template = Handlebars.compile($("#people-template").html());
    var data = {
        people: [
            { first_name: "Alan", last_name: "Johnson" },
            { first_name: "Allison", last_name: "House" },
        ]
    };
    $('#list').html(template(data));
});
</script>
Wayfaring answered 4/2, 2013 at 22:35 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.