Javascript Django模板-服务器端Django标记的客户端操作

Javascript Django模板-服务器端Django标记的客户端操作,javascript,python,django,django-templates,Javascript,Python,Django,Django Templates,我知道Django在服务器端呈现模板。浏览器接收HTML内容,然后可以使用JavaScript对其进行操作 我有一些JavaScript代码来操作Django语言标记,这些代码在当前形式下很难维护,因此我试图找到一种更好的编码方法,但我想不出这样的方法,需要一些帮助 这是我的密码: 动态语言代码是两个字母的代码,即:en、fr、bg、ru、es等 function dateCalculation(dynamic_language_code) { var c = dynamic_lang

我知道Django在服务器端呈现模板。浏览器接收HTML内容,然后可以使用JavaScript对其进行操作

我有一些JavaScript代码来操作Django语言标记,这些代码在当前形式下很难维护,因此我试图找到一种更好的编码方法,但我想不出这样的方法,需要一些帮助

这是我的密码:

动态语言代码是两个字母的代码,即:en、fr、bg、ru、es等

function dateCalculation(dynamic_language_code) {

    var c = dynamic_language_code;

    //arabic
    if (dynamic_language_code == 'ar'){

        var_month = "{% language 'ar' %}{% trans 'month' %}{% endlanguage %}";
        var_months = "{% language 'ar' %}{% trans 'months' %}{% endlanguage %}";
        var_year = "{% language 'ar' %}{% trans 'year' %}{% endlanguage %}";
        var_years = "{% language 'ar' %}{% trans 'years' %}{% endlanguage %}";

    //bulgarian.  
    } else if (dynamic_language_code == 'bg'){

        var_month = "{% language 'bg' %}{% trans 'month' %}{% endlanguage %}";
        var_months = "{% language 'bg' %}{% trans 'months' %}{% endlanguage %}";
        var_year = "{% language 'bg' %}{% trans 'year' %}{% endlanguage %}";
        var_years = "{% language 'bg' %}{% trans 'years' %}{% endlanguage %}";

    } 
    ........
    many more else if conditions
    ........
    //default value of English.  
    } else {

        var_month = "{% language 'en' %}{% trans 'month' %}{% endlanguage %}";
        var_months = "{% language 'en' %}{% trans 'months' %}{% endlanguage %}";
        var_year = "{% language 'en' %}{% trans 'year' %}{% endlanguage %}";
        var_years = "{% language 'en' %}{% trans 'years' %}{% endlanguage %}";

    } 
}
代码应根据传入的动态语言代码值动态更改月份、年份的语言。实际上不需要if-else语句,只需要使用传入的动态_语言_代码值分配var_月、var_月、var_年和var_年值

如何构造上述代码以摆脱if-else条件,并使用传入的动态语言代码返回正确的语言版本?

编辑

我想去掉if-else条件,只使用动态语言标记将变量分配给语言代码。我不知道我怎么做,甚至不知道这是否可以做到。例如:

var_month = "{% language dynamic_language_code %}{% trans 'month' %}{% endlanguage %}";
var_months = "{% language dynamic_language_code %}{% trans 'months' %}{% endlanguage %}";
var_year = "{% language dynamic_language_code %}{% trans 'year' %}{% endlanguage %}";
var_years = "{% language dynamic_language_code %}{% trans 'years' %}{% endlanguage %}";

为了简化javascript代码,您可以进行简单的字符串替换,例如:

function dateCalculation(dynamic_language_code) {
    var lang = dynamic_language_code || 'en';  //handle default case
    var_month = "{% language '<<lang>>' %}{% trans 'month' %}{% endlanguage %}".replace("<<lang>>", lang);
    var_months = "{% language '<<lang>>' %}{% trans 'months' %}{% endlanguage %}".replace("<<lang>>", lang);
    var_year = "{% language '<<lang>>' %}{% trans 'year' %}{% endlanguage %}".replace("<<lang>>", lang);
    var_years = "{% language '<<lang>>' %}{% trans 'years' %}{% endlanguage %}".replace("<<lang>>", lang);
}
  • 确保您的
    MIDDLEWARE\u类包含
    'django.MIDDLEWARE.locale.localemidleware'

  • 使用将
    RequestContext
    传递到模板上下文的函数呈现模板,例如
    django.shortcuts.Render
    肯定会完成这项工作

  • 以下是我用来演示其工作原理的示例模板:

    {% load i18n %}
    <html>
        <head></head>
        <body>
            <script type="text/javascript">
            var languages = {% templatetag openbrace %}{% for lang in LANGUAGES %}
                "{{ lang.0 }}": {% templatetag openbrace %}
                    "month": "{% language lang.0 %}{% trans 'month' %}{% endlanguage %}",
                    "months": "{% language lang.0 %}{% trans 'months' %}{% endlanguage %}",
                    "year": "{% language lang.0 %}{% trans 'year' %}{% endlanguage %}",
                    "years": "{% language lang.0 %}{% trans 'years' %}{% endlanguage %}",
                {% templatetag closebrace %}{% if not forloop.last %},{% endif %}
            {% endfor %}{% templatetag closebrace %};
    
            function dateCalculation(dynamic_language_code) {
                var_month = languages[dynamic_language_code].month;
                var_months = languages[dynamic_language_code].months;
                var_year = languages[dynamic_language_code].year;
                var_years = languages[dynamic_language_code].years;
                console.log(var_month);
                console.log(var_months);
                console.log(var_year);
                console.log(var_years);
            }
            dateCalculation('en');
            </script>
        </body>
    </html>
    

    为了避免页面刷新,可以将翻译放在JSON文件中,例如
    {“en”:{“month”:“xxx”,“months”:“xxx”},“ar”:{}
    。使用AJAX动态获取文件。或者将翻译放在专用的JS文件中。或者查看Django文档。

    简单的回答是你不能这样做

    因为客户端/服务器端的关系

    尝试对项目使用include,这样可以多次调用代码,但项目中只有一个代码引用


    希望这对您有所帮助。

    您有什么理由必须使用JS翻译单个文本吗?我认为一个好的设计是将实际的翻译工作留给模板系统,而JS或服务器视图只决定使用哪种语言。例如,在用户切换语言后,您可以刷新页面并通过请求头将首选语言发送到服务器。服务器仅呈现首选语言的翻译文本。这是关于Django side.ZZY中的开关语言,我使用JavaScript来避免页面刷新。我绝对不想刷新页面。JS用于在数据发送到数据库之前动态显示timspan。我认为user3354539将JS代码嵌入到html中。他的服务器提供代码中所有语言的翻译。然后在客户端,js函数选择要使用的文本Andrean,我无法让这个替换代码工作!我在问题中提供的示例javascript确实起作用,并被触发以动态显示更改语言中的日期时间跨度。但是我需要让代码比当前更易于维护。@user3354539:我测试了代码,因为它粘贴在这里,当我
    console.log
    变量时,我得到了正确的输出。检查您是否正确复制了它,或者您是否对其进行了额外修改,确保您没有引入其他问题。@user3354539如果没有提供语言代码,则默认值可能是您测试的代码,我现在更新了代码以处理这种情况。andrean,此代码不起作用。我已经用几种不同的方法对它进行了测试。ZZY,这仍然会给我带来难以维护的代码。如果我在我的项目中添加语言,我还必须添加到您建议的代码中。事实上,这不是真的,我通过下面描述的说明能够实现他的目标,但我怀疑他是否曾尝试过。
    {% load i18n %}
    <html>
        <head></head>
        <body>
            <script type="text/javascript">
            var languages = {% templatetag openbrace %}{% for lang in LANGUAGES %}
                "{{ lang.0 }}": {% templatetag openbrace %}
                    "month": "{% language lang.0 %}{% trans 'month' %}{% endlanguage %}",
                    "months": "{% language lang.0 %}{% trans 'months' %}{% endlanguage %}",
                    "year": "{% language lang.0 %}{% trans 'year' %}{% endlanguage %}",
                    "years": "{% language lang.0 %}{% trans 'years' %}{% endlanguage %}",
                {% templatetag closebrace %}{% if not forloop.last %},{% endif %}
            {% endfor %}{% templatetag closebrace %};
    
            function dateCalculation(dynamic_language_code) {
                var_month = languages[dynamic_language_code].month;
                var_months = languages[dynamic_language_code].months;
                var_year = languages[dynamic_language_code].year;
                var_years = languages[dynamic_language_code].years;
                console.log(var_month);
                console.log(var_months);
                console.log(var_year);
                console.log(var_years);
            }
            dateCalculation('en');
            </script>
        </body>
    </html>
    
        <html>
            <head></head>
            <body>
                <script type="text/javascript">
                var languages = {
                    "en": {
                        "month": "month",
                        "months": "months",
                        "year": "year",
                        "years": "years",
                    },
    
                    "de": {
                        "month": "Monat",
                        "months": "Monate",
                        "year": "Jahr",
                        "years": "Jahre",
                    },
    
                    "es": {
                        "month": "mes",
                        "months": "meses",
                        "year": "año",
                        "years": "años",
                    }               
                };
    
                function dateCalculation(dynamic_language_code) {
                    var_month = languages[dynamic_language_code].month;
                    var_months = languages[dynamic_language_code].months;
                    var_year = languages[dynamic_language_code].year;
                    var_years = languages[dynamic_language_code].years;
                    console.log(var_month);
                    console.log(var_months);
                    console.log(var_year);
                    console.log(var_years);
                }
                dateCalculation('es');
                </script>
            </body>
        </html>
    
    mes
    meses
    año
    años