标签: i18next

我使用 i18next 翻译电子邮件模板。它们包含文本需要的按钮， 以防止智能手机电子邮件阅读器上的不良渲染。为了防止智能手机电子邮件阅读器将按钮分成两部分，我确实需要有不间断的空格。

问题是，i18next 转义了 html。

My button我没有My button进入按钮，而是进入了按钮。

这是一个简化版本（伪代码），说明了我想要实现的目标：

BTN_ACTION = 'My button';

i18n.init(options, function (t) {
    t('BTN_ACTION')
};

玉模板如下所示：

a#btn-create-account(href='url')=t('BTN_ACTION')

我想渲染一个 JSON 数组

{"myArray": [ {"name": "Steve"}, {"name": "Tom"} ]}

在两个 HTML 中span：

<span data-i18n="...">Steve should appear here<span>
<span data-i18n="...">Tom should appear here<span>

我应该设置什么值data-i18n来实现这一目标，或者您可以推荐其他方法吗？

我是Aurelia的新手,但到目前为止真的很享受.但是,文档仍然缺乏某些方面,比如使用i18n插件进行本地化.

我设置了语言文件(translation.json)并将语言文本标签插入到HTML模板中,但我看到了两种不同的格式.我已经成功地工作但我不知道每个的优点和缺点所以我犹豫是否要承诺更新我的所有模板,除非我知道哪个是最好的和为什么.

区域设置/ EN/translation.json

{
  "hello": "Hello, World!",
  "lang_msg": "This message is in English."
}

区域设置/ ES/translation.json

{
  "hello": "¡Hola, Mundo!",
  "lang_msg": "Este mensaje está en español."
}

模板格式1:

<template>
  <h1>${ 'hello' | t }</h1>
  <h2>${ 'lang_msg' | t }</h2>
</template>

模板格式2:

<template>
  <h1><span t="hello"></span></h1>
  <h2><span t="lang_msg"></span></h2>
</template>

我应该使用模板格式1还是2？为什么？

如果未找到密钥的翻译，默认情况下，i18next翻译库似乎会回退到翻译密钥。

// No translation defined for CANCEL yet
i18next.t('CANCEL') // Returns 'CANCEL'

如果找不到该键的翻译，我希望回退到一条独特的消息，该消息可以很明显地表明我们错过了翻译或输入了错误的翻译键。最好在消息中提及密钥，例如

i18next.t('CANCEL') // Returns 'No translation found for "CANCEL"'

某种后备回调函数将是理想的，因为这样我们也可以登录到控制台/远程服务来查找所有缺少的翻译。

如何使用i18next库实现类似的功能？

我有这个异步代码函数可以从 AsyncStorage 获取 lang var。我想在构造（？）方法中的每个应用程序页面上调用此函数。但是当我尝试调用它时，看起来代码是同步运行的，我的 loadLang 是 = { _45: 0, _81: 0, _65: null, _54: null }。如何以正确的方式去做？谢谢。

main.js

import load from "./components/languageLoad"
               constructor(props) {
                    super(props);

                    let loadedLang = load();
                    console.log("LOADED", loadedLang);

                    this.state = {
                        settings: 1,
                        deviceLocale: "EMPTY"
                    };
                }

语言加载.js

import React, { Component } from 'react';
import { AsyncStorage} from 'react-native';
import Lang from 'react-native-i18n'

export default load = async () => {
            try {
                const customLang = await AsyncStorage.getItem('customLang');
                if (customLang !== null && customLang !== …

我正在尝试开始在 Express 服务器上使用 i18next，但无法根据文档中的示例使其正常工作。

我的应用程序由 index.js（我的 Express 服务器）、package.json 和一个locales包含两个翻译文件的目录组成：en.json 和 es.json。

索引.js

'use strict';

const express = require('express');
const i18n = require('i18next');
const i18nMiddleware = require('i18next-express-middleware');
const path = require('path');

const app = express();
const port = process.env.PORT || 8080;

i18n
  .use(i18nMiddleware.LanguageDetector)
  .init({
    fallbackLng: 'en',
    lowerCaseLng: true,
    preload: ['en', 'es'],
    resGetPath: path.join(__dirname, 'locales/__lng__.json'),
    useCookie: false
  });

app.use(i18nMiddleware.handle(i18n, {
  removeLngFromUrl: false
}));

app.get('/', (req, res) => {
  res.send(req.t('home.title'));
});

app.use(express.static(path.join(__dirname, 'public')));

module.exports = app.listen(port, (err) => {
  if (err) …

我正在尝试将 i18next 翻译系统添加到我的 React 应用程序中，并且我已经配置了所有内容，但我似乎找不到如何更改语言（例如，使用选择或按钮）。

我按照这个简单的指南来设置整个过程。但没有关于如何手动更改语言的信息。而且，正如您在此处看到的，有一个更改语言的函数，但它位于函数组件内：

function Page() {
const { t, i18n } = useTranslation();

  const changeLanguage = lng => {
    i18n.changeLanguage(lng);
  };

  return ([...])
}

但是，我的组件是一个从组件扩展的类，它的工作方式似乎不同：

class Profile extends Component {
  [...]
}
export default withTranslation()(Profile);

那我该怎么办呢？我不知道。

我有一个用 React hook 编写的项目，我想更改语言。我使用 i18n，但是当我使用 useTranslation 更改语言时，它加载的时间很长，我不知道如何修复它。请帮助我解决这个问题，并对我的英语不好表示歉意。

文件路径：

const Routes = () => {
  return (
    <Suspense fallback={<BrandLoading />}>
      <Switch>
        <RouteWithLayout
          component={DashboardView}
          exact
          layout={MainLayout}
          path={`/${routeUrls.dashboard.path}`}
        />
      </Switch>
    </Suspense>
  );
};

export default Routes;

文件App.js

import React from 'react';
import { Router } from 'react-router-dom';
import { createBrowserHistory } from 'history';
import { ThemeProvider } from '@material-ui/styles';
import theme from 'theme';
import Routes from 'routes';
import './i18n'

const browserHistory = createBrowserHistory();
const App = () => {
  return (
    <ThemeProvider theme={theme}> …

我正在使用 i18n 翻译我的多语言 React 项目。\n我将在我的翻译文件中使用版权符号 (©)。但它无法显示 \xc2\xa9 符号并显示“©” 作为字符串。

这是我的翻译文件：

"footer.copyright":\n    "Copyright © {{current_year}} {{COMPANY_NAME}}. All right reserved."\n

我将其放入我的组件中，如下所示：

<Trans\n   i18nKey="footer.copyright"\n   values={{ current_year, COMPANY_NAME}}\n/>\n

我想显示：版权所有 \xc2\xa9 2020 我的公司。保留所有权利。

目前我有很多日志使得i18next控制台难以使用：

我需要i18next使用警告级别而不是默认信息级别，以便能够过滤它们。

我正在检查文档，但我没有看到任何选项。我当前的配置是：

i18n
  .use(XHR)
  .use(LanguageDetector)
  .init({
    debug: true,
    lng: 'en',
    keySeparator: false,
    addMissing: true,
    interpolation: {
      escapeValue: false
    },

    resources: {
      en: {
        translations: translationEng
    },
    ns: ['translations'],
    defaultNS: 'translations'
  })