javascript - nunjucks function arguments arrive undefined -
i have been using nunjucks several months, , have found great templating engine. however, morning ran issue seems simple, cannot figure out. hoping set of eyes can point solution.
the problem: if pass function template, arguments passed function undefined inside function body.
values , objects can passed templates without problem, , if pass function can log console within function (so know function there), arguments undefined.
this seemed solved closure, 1) dont see closures in examples can find, , 2) when tried closure found receive undefined arguments.
through course of day have pared code simplest possible case , still cant figure out:
the template:
<div> <p>{{ value }}</p> <p>{{ object|pretty }}</p> <p>{{ func(4) }}</p> <p>{{ args(4)|pretty }}</p> <p>{{ local(4) }}</p> </div> the code renders template (this inside of requirejs define, not shown):
var nunjucks = require('lib/nunjucks-slim.min'), // v1.3.4 env = new nunjucks.environment(null), // global templates $tgt = $('#test'), local; env.addglobal('value', 3); env.addglobal('object', { a: 2 }); env.addfilter('pretty', function (obj) { return json.stringify(obj, null, 2); }); env.addglobal('func', function (val) { return 'func: ' + val; }); env.addglobal('args', function () { return arguments; }); local = function (val) { return 'local: ' + val; }; $tgt.html(env.render('test.nj', { 'local': local })); and rendered html looks this:
3 // value { "a": 2 } // object|pretty func: undefined // func {} // args local: undefined // local so, value fine. object works well, , looks nice after passing through "pretty" filter.
however, value passed "func" becomes undefined in function body, , using arguments variable inside function doesnt help. furthermore, passing function directly template context (local) doesnt work either.
filters (which functions) work fine, regular functions dont, whether passed part of template context or global.
a few notes might help:
i using requirejs although (except importing nunjucks itself) have tried eliminate equation.
this example uses nunjucks v1.3.4. through course of debugging tried verify behavior in v2.1 appears v2.x may have broken requirejs compatibility, , didnt want tackle 2 problems in parallel.
i precompiling templates using grunt-nunjucks, uglifying result. relevant portions of gruntfile follows:
module.exports = function (grunt) { 'use strict'; grunt.initconfig({ pkg: grunt.file.readjson('package.json'), nunjucks: { common: { basedir: 'site/', src: [ 'site/core/**/*.nj' ], dest: 'application/static/js/common.js' }, }, uglify: { templates: { options: { preservecomments: false, mangle: true, compress: { dead_code: true, loops: true, conditionals: true, booleans: true, unused: true, if_return: true, join_vars: true, drop_console: true } }, files: { 'application/static/js/common.min.js': ['application/static/js/common.js'], } } }, }); grunt.loadnpmtasks('grunt-nunjucks'); grunt.loadnpmtasks('grunt-contrib-uglify'); };
the test template (shown above) 1 of several compiled common.js, uglified common.min.js using settings above. note have tried compiling templates without uglifying, same result.
this pretty basic functionality if bug expect see lots of references on se , in issue log, hardly find any. assume missing obvious, cant seem find it.
any thoughts?
after continuing debug took uglification , requirejs out of equation following test setup:
index.html:
<html> <head> <script src="nunjucks-slim.js"></script> <script src="common.js"></script> </head> <body> <script src="test.js"></script> </body> </html> my template, precompiled common.js:
<div> <p>{{ value }}</p> <p>{{ object|pretty }}</p> <p>{{ func(4) }}</p> <p>{{ func(x) }}</p> <p>{{ args(4)|pretty }}</p> <p>{{ local(4) }}</p> <p>{{ local(x) }}</p> </div> test.js code exercises template:
var env = new nunjucks.environment(null), local; env.addglobal('value', 3); env.addglobal('object', { a: 2 }); env.addfilter('pretty', function (obj) { return json.stringify(obj, null, 2); }); env.addglobal('func', function (val) { return 'func: ' + val; }); env.addglobal('args', function () { return arguments; }); local = function (val) { return 'local: ' + val; }; console.log(env.render('core/root/test.nj', { 'local': local, 'x': 4 })); finally, output demonstrates problem (with added comments):
<div> <p>3</p> // value <p>{ "a": 2 // object|pretty }</p> <p>func: undefined</p> // func(4) <p>func: undefined</p> // func(x) <p>{}</p> // args(4)|pretty <p>local: undefined</p> // local(4) <p>local: undefined</p> // local(x) </div> i spent several hours stepping through compiled template code try find issue (which informative, way), face-palmed - since had eliminated requirejs try once more nunjucks v2.1.0.
a few clicks later, had working test code:
<div> <p>3</p> <p>{ a: 2 }</p> <p>func: 4</p> <p>func: 4</p> <p>{ 0: 4 }</p> <p>local: 4</p> <p>local: 4</p> </div> so, while have been nice figure out , solve problem (with v1.3.4), the answer seems "upgrade nunjucks v2.1.0".
Comments
Post a Comment