由于 Django 不允许在其他文件中内置 it 标签，如何解决 JavaScript 外部文件的翻译/本地化问题？

Question

我正在寻找其他问题。

• 我知道 Django 允许在 HTML 页面的内部 JavaScript 代码中使用内置标签，但这是一个不好的做法，专业开发人员不会这样做；
• 我知道 Django 不允许在外部 JavaScript 文件中使用内置标签。与此不同的是，Go Hugo 允许。
• 我考虑了问题Javascript文件中的Django翻译，但我不知道生成具有相同名称但具有不同语言缩写的JavaScript是否是一种不好的做法，如

  table-en.js

  ，

  table-fr.js

  ，

  table-pt-br.js 

  、

  table-pt-pt.js

  等

小代码，例如：

var preTtitle = 'List of colours and icon in';

const styles = 
[
  { name: 'adwaita-plus', title: ' ' + preTtitle + 'Adwaita++' },
  { name: 'suru-plus', title: ' ' + preTtitle + 'Suru++' },
  { name: 'suru-plus-ubuntu', title: ' ' + preTtitle + 'Ubuntu++' },
  { name: 'yaru-plus', title: ' ' + preTtitle + 'Yaru++' }
];

我还需要翻译表格列：

firstHeader.textContent = 'Name of colour';
secondHeader.textContent = 'Preview of icons';

trHeader.appendChild(firstHeader);
trHeader.appendChild(secondHeader);

thead.appendChild(trHeader);

我想翻译

'List of colours and icon in'

、

'Name of colour'

和

'Preview of icons'

。

Django不允许在该文件中使用内置的翻译标签，如何解决？

我确信问题 Javascript 文件中的 Django 翻译 是否是唯一的解决方案以及好或坏的做法。

Answer 1

我昨天遇到了这个问题，有人提出了更好的解决方案。您实际上可以翻译 JavaScript 文件中的文本，而无需在 HTML 模板中获取翻译。

Django Translation 为您提供了 JavaScriptCatalog，这允许您使用

gettext()

翻译 js 文本，就像在视图中一样。

url.py

from django.views.i18n import JavaScriptCatalog

urlpatterns = [
    path('jsi18n/', JavaScriptCatalog.as_view(), name='javascript-catalog'),
]

index.html

<script src="{% url 'javascript-catalog' %}"></script>

脚本.js

// In this example your body will get the translated version of "Hello"
document.body.innerHTML = gettext('Hello');

如何生成翻译文件：

django-admin makemessages -d djangojs -l es

此处的区别在于您将在命令中添加 -d djangojs 。

完成翻译后，您可以像模板和视图翻译一样编译消息：

django-admin compilemessages

Django 文档： https://docs.djangoproject.com/en/4.0/topics/i18n/translation/#internationalization-in-javascript-code

提供解决方案的问题： https://stackoverflow.com/questions/71757020/how-to-translate-text-in-an-external-javascript-file-django/71758709#71758709

@hendrikschneider 提供的解决方案：

大部分工作将由django完成。遵循他们的文档： https://docs.djangoproject.com/en/4.0/topics/i18n/translation/#internationalization-in-javascript-code

页面下方还记录了如何生成 JavaScript 代码的语言文件。你将拥有两种语言 稍后的文件，一个用于您的 django 应用程序，另一个用于您的 JavaScript 代码。

https://docs.djangoproject.com/en/4.0/topics/i18n/translation/#creating-message-files-from-javascript-source-code

Answer 2

您可以在 javascript 文件中创建函数并在 html 中导入该文件。然后，翻译模板中所需的对象，然后将翻译后的文本传递给您创建的函数。没有其他办法，不用担心不好的做法。

<script src="{% static 'js/translation_helpers.js' %}"></script>
<script>
    let frenchText = {% translate "something in french" %}
    functionYouCreated(translatedText, 'fr')
    let englishText = {% translate "something in english" %}
    functionYouCreated(translatedText, 'en')
</script>

要更改模板中的翻译语言，请参阅 https://docs.djangoproject.com/en/3.2/topics/i18n/translation/#switching-language-in-templates