Change default delimiters in ember.js

Question

(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?

score 4 · Accepted Answer · edited May 23 '17 at 12:12

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

edited May 23 '17 at 12:12

Community

1
1

answered Aug 26 '12 at 22:58

sly7_7

11,961
3
40
54

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. – blueFast Aug 27 '12 at 16:47
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... :( – sly7_7 Aug 27 '12 at 20:42

score 3 · Answer 2 · answered Aug 27 '12 at 19:46

3

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

answered Aug 27 '12 at 19:46

Massimo

1,653
12
11

Thanks Massimo, that's what I did. – blueFast Aug 27 '12 at 21:14

score 1 · Answer 3 · answered Feb 04 '13 at 22:35

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>

Change default delimiters in ember.js

3 Answers3