underscore template function override to inject HTML globally

Question

I tried with this question to override template function globally using require function and it works well for templateSetting.

I tried to extend/override the _.template function to wrap div using below code. But getting with plain template not parsed template like this <%= title %>

    define(['underscoreBase'], function(_) {
    _.template = function(str){
        return "<div class='test'>"+str+"</div>";
    };
    return _;
});

How do we acheive adding/wrap some HTML tag with _.template string content? Please advise.

Extending and overriding are completely different things. What exactly do you need? — Henrique Barcelos, Jan 06 '16 at 13:20
@HenriqueBarcelos I wanted to override the _.template string to wrap with HTML — mymotherland, Jan 06 '16 at 13:22

Henrique Barcelos · Answer 1 · 2016-01-06T13:39:47.787

0

You need to keep a reference to the original template function:

define(['underscoreBase'], function(_) {
    var oldTemplate = _.template;
    _.template = function(str){
        return oldTemplate("<div class='test'>"+str+"</div>");
    };
    return _;
});

edited Jan 06 '16 at 13:39

answered Jan 06 '16 at 13:23

Henrique Barcelos

7,670
1
41
66

I tried,but got something like this function (obj){obj||(obj={});var __t,__p='',__e=_.escape,__j=Array.prototype.join;function print(){__p+=__j.call(arguments,'')}with(obj){__p+=' \r\n '; if (showRootHeader) { ; __p+='\r\n '+((__t=( title ))==null?'':__t)+' \r\n '; } ; __p+='\r\n – mymotherland Jan 06 '16 at 13:26
I tried already,now Uncaught ReferenceError: title is not defined :( – mymotherland Jan 06 '16 at 13:41
even i checked like _.template = function(str){ return str; }; returns same function code – mymotherland Jan 06 '16 at 13:43
There is no `title` in the code. This might be something else. – Henrique Barcelos Jan 06 '16 at 13:43
template str will have <%= title %> – mymotherland Jan 06 '16 at 13:45
So you need to call it like `_.template(' <%= title %>')({title: 'This is a title'})`. – Henrique Barcelos Jan 06 '16 at 13:56

score 0 · Answer 2 · answered Jan 07 '16 at 08:37

0

I have implemented it like

var oldTemplate = _.template;
    function template(str, data) {
        return oldTemplate(
            "<div class='test'>"+str+"</div>",
            data
        );
    }
_.mixin({ template:template });
return _;

answered Jan 07 '16 at 08:37

mymotherland

7,968
14
65
122

underscore template function override to inject HTML globally

2 Answers2