web-dev-qa-db-fra.com

Comment utiliser les modules de noeuds (comme MomentJS) dans les vues EJS?

Pour utiliser MomentJS dans views/custom.ejs, quelle est la bonne manière (le cas échéant)?

  1. Du côté serveur

    routes/index, etc, nous pouvons facilement utiliser require('moment');, etc. et cela fonctionne bien.

  2. Côté serveur (vues EJS)

    views/custome.ejs, quelque chose comme <% var m = require('moment'); %> ne fonctionne pas

J'utilise ExpressJS avec EJS comme moteur de gabarit.

node.jsexpressejsmomentjs
31
dmodulus

J'ai trouvé un autre moyen de le faire et je pense que cela présente certains avantages.

  • Ne corrigez pas vos filtres d’exportation de code.
  • Accédez à n’importe quelle méthode sans avoir besoin de toutes les exporter.
  • Meilleure utilisation de l'ejs (no | pipes).

Sur votre contrôleur ou view.js, procédez comme suit: 

var moment = require('moment');
exports.index = function(req, res) {
    // send moment to your ejs
    res.render('index', { moment: moment });
}

Maintenant, vous pouvez utiliser le moment dans votre ejs:

<html>
    <h1><%= moment().fromNow() %></h1>
</html>

Je ne suis pas un expert en nœud, alors si quelqu'un voit quelque chose de mauvais en le faisant, faites-le-moi savoir! :)

54
robertomarin

Une autre option:

De cette manière, vous définissez la variable moment sur un emplacement local disponible pour tous les scripts de toutes les pages EJS de votre site.

Dans votre fichier "index.js" (ou "app.js"), procédez comme suit: (après avoir configuré votre "application" avec Express)

var moment = require('moment');
var shortDateFormat = "ddd @ h:mmA"; // this is just an example of storing a date format once so you can change it in one place and have it propagate
app.locals.moment = moment; // this makes moment available as a variable in every EJS page
app.locals.shortDateFormat = shortDateFormat;

Ensuite, dans votre fichier EJS, vous pouvez faire référence à moment (et shortDateFormat) sous forme de variables comme celle-ci:

<%= moment(Date()).format(shortDateFormat) %>

C'est peut-être un peu plus élégant?

19
Matt Manuel

J'utilise moment côté serveur avec ejs. J'ai écrit une fonction de filtre ejs qui reviendra de Now.

npm install moment

./views/page.ejs

<span class="created_at"><%=: item.created_at | fromNow %></span>

./routes/page.js

var ejs = require('ejs')
  , moment = require('moment');

ejs.filters.fromNow = function(date){
  return moment(date).fromNow()
}
10
chovy
var moment = require('moment');
app.locals.moment = require('moment');

Utiliser dans la vue:

<%= moment(myDateValue).fromNow() %>

Maintenant, vous pouvez simplement utiliser moment dans vos fichiers EJS.

8
Mostafa Darezereshki

Que diriez-vous de transmettre require comme ceci:

res.render('index', { require: require });

Vous pourriez avoir besoin de Tweak pour maintenir le chemin:

res.render('index', { require: module => require(module /* here you may insert path correction */) });

Évidemment, cela fonctionne avec Node (backend) uniquement.

2
haxpanel

Vous pouvez créer la fonction et l'attacher à app.locals. et l'utiliser dans le template ejs côté serveur.

Vous faites dans votre fichier de routes

../routes/page.js

var ejs = require('ejs')
  , moment = require('moment');

app.locals.fromNow = function(date){
  return moment(date).fromNow();
}

../views/page.ejs

<span class="created_at"><%= fromNow(item.created_at) %></span>

Rappelez-vous simplement d'avoir un moment ajouté à votre fichier package.json 

1
user2125268

Le côté serveur (vues EJS) que vous avez mentionné ci-dessus est exécuté sur le navigateur et non sur votre serveur. Vous ne pouvez pas utiliser require car les navigateurs ne peuvent pas le comprendre. Vous devez importer le moment.js pour l'utiliser

<script src="/js/moment.min.js"></script>
1
Vinoth

J'ai écrit un aide pour revenir moment pour utiliser sur ejs vue et mises en page.

./helpers/utils/get-moment.js

    const moment = require('moment');

module.exports = {
  friendlyName: 'formatMoney',
  description: 'format money number.',

  inputs: {
  },
  sync: true,
  exits: {
  },

  fn: function (inputs, exits) {
    return exits.success(moment);
  }
};

Puis en utilisant:

const moment = sails.helpers.utils.getMoment();
0
phuong nguyen

je pense aussi que c'est une bonne idée si vous voulez, vous pouvez ajouter un middle-ware où vous pouvez ajouter ce que vous voulez à la couche thème, y compris utilisateur, configuration et moment:

// config, user, moment to the theme layer
app.use(function (req, res, next) {
    // grab reference of render
    var _render = res.render;
    // override logic
    res.render = function (view, options, fn) {
        // extend config and continue with original render
        options = options || {};
        options.config = config;
        options.moment = moment;
        if (req.user && req.user.toJSON) {
            options.user = req.user.toJSON();
        }
        _render.call(this, view, options, fn);
    }
    next();
});
0
Fareed Alnamrouti