0

我想在 Jade 模板中使用momentjs（更一般地说，任何其他函数）作为帮助器，用于服务器和客户端。在服务器（Express.js 3.x）上，我将它添加到app.locals，它工作正常：

服务器端

// Locals
app.locals.moment = require('moment');

// Routes
app.get('/', function (req, res) {
    res.render('index.jade')
});

app.listen(config.get('server').port);

因此，moment当模板 ( index.jade) 由服务器呈现然后/作为纯 HTML 提供时，使用帮助程序可以正常工作。

客户端

在客户端（RequireJS 模块系统）上，我使用 Backbone.js 以及 Jade 来呈现视图。如何moment在中使用助手navbar.jade？

define(
    ['jade', 'backbone', 'text!views/navbar.jade'],
    function (Jade, Backbone, navbarTemplate) {
        return Backbone.View.extend({

            initialize: function () {
                this.template = Jade.compile(navbarTemplate);
            },

            render: function () {
               this.$el.html(this.template(this.model));

               return this;
            }

        });
    }
);

编辑：根据 Peter Lyons 的建议，我已经包装了compile函数。moment有效但foo无效（p= moment()vs p= foo()，后者让我无法调用未定义的函数）：

define(['jade', 'lodash', 'moment'], function (Jade, _) {

    return {
        compile: function(str, options) {

            options.locals = _.extend({
                moment:  require('moment'),
                foo: function () { return 'bar'; }
            }, options.locals);

            return Jade.compile(str, options);
        }
    };
});
4

1 回答 1

0

当您在浏览器中调用已编译的模板函数时，没有开箱即用的功能app.locals，因此您必须对其进行编码。

//customJade.js module
define(function (require, exports) {
    var jade = require('jade');
    var moment = require('moment');
    exports.compile = function(jadeString) {
      //build the normal jade template function
      var jadeFn = jade.compile(jadeString);
      //build a wrapper function with same API
      var customFn = function(locals) {
        //in the wrapper, add your shared locals as needed
        locals.moment = locals.moment || moment;
        locals.appName = "Super Happy Fun App!";
        //return the result of the real jade template function,
        //but with combined locals
        return jadeFn(locals);
      };
      //return your wrapper function instead of the regular jade function
      return customFn;
    }
});

.

//your backbone view module
define(['customJade', 'jadeTemplateString'], function (customJade, jadeTemplateString) {
   //blah blah your View subclass...
   template: customJade.compile(jadeTemplateString),
   //...
});
于 2013-07-02T14:56:05.133 回答