Express Handlebars中#each循环内i18n助手翻译异常问题求助

Hey there, I’ve run into this exact issue before—when you drop an i18n helper inside an #each loop, Handlebars switches the current context, and your translation helper can’t reach the global i18n functions anymore. Let’s break down the fixes step by step:

1. Use the Root Context to Access the i18n Helper #

The most common culprit here is that #each changes the this context to the individual item in your roomsList array. Your i18n helper is almost certainly attached to the global (root) context, not each room object.

Fix this by explicitly referencing the root context with @root in your template. For example, if your original code had something like:

<div class="room-description">{{i18n "room.description"}}</div>

Update it to:

<div class="room-description">{{@root.i18n "room.description"}}</div>

@root points directly to the top-level context where your i18n helper is registered, so it’ll work no matter how deep your loops are.

2. Double-Check Your i18n Helper Registration #

Make sure your i18n helper is properly tied to the global context in your Express Handlebars setup. If you’re using a module like i18n-node, you should mount the translation function to res.locals so it’s available across all templates. Here’s a quick example of how to set this up:

const i18n = require('i18n');
const hbs = require('express-handlebars');

// Configure i18n first
i18n.configure({
  locales: ['en', 'es'],
  directory: __dirname + '/locales',
  defaultLocale: 'en'
});

// Register Handlebars engine with the i18n helper
app.engine('handlebars', hbs({
  helpers: {
    i18n: function(key) {
      // Use the root context's translation function
      return this.t(key);
    }
  }
}));

// Middleware to attach translation function to res.locals
app.use((req, res, next) => {
  res.locals.t = req.__; // req.__ is provided by i18n-node
  next();
});

If your helper isn’t leveraging the root context’s translation function, it’ll fail when this points to a room item instead of the global context.

3. Verify Your Translation Keys Exist #

Don’t overlook the basics! Make sure the key you’re passing to i18n actually exists in your locale files. For example, if you’re calling {{@root.i18n "room.description"}}, check that locales/en.json has:

{
  "room": {
    "description": "Your room description here"
  }
}

A missing key will just render nothing or the key itself—easy to miss if you’re focused on the loop issue.

Quick Debug Test #

To confirm it’s a context issue, try using the same i18n key outside the #each loop. If it works there but not inside, you know the problem is definitely the context switch from #each.

Give these fixes a shot—9 times out of 10, it’s the missing @root reference that’s causing the problem.

内容的提问来源于stack exchange，提问作者toh19