Django模板 - 服務器端django標籤的客戶端操縱

我知道Django在服務器端呈現模板。瀏覽器接收HTML內容，然後可以使用JavaScript來操作。Django模板 - 服務器端django標籤的客戶端操縱

我有一些JavaScript代碼來操縱Django語言標記，這將難以維持其目前的形式，所以我想用更好的方式來編碼它，但我想不出這樣的方式和需要一些幫助。

這裏是我的代碼：

的dynamic_language_code是兩個字母組成的代碼，即：英語，法語，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 %}"; 

    } 
}

代碼應該動態改變的語言月，年份根據傳入的dynamic_language_code值。實際上應該不需要if else語句，只需使用傳入的dynamic_language_code值來分配var_month，var_months，var_year和var_years值即可。

如何構造上面的代碼以擺脫if else條件，並仍然使用傳入的dynamic_language_code返回正確的語言版本？

編輯

我想擺脫的，如果其他條件，只是分配使用動態語言標籤的變量的語言代碼。不知道我該怎麼做，或者即使這可以做到。例如：

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 %}";

來源

2014-11-04 user3354539

是否有任何理由必須使用JS來翻譯單個文本？我認爲一個好的設計是將實際的翻譯工作留給模板系統，而JS或服務器視圖只決定使用哪種語言。例如，在用戶切換語言後，您可以刷新頁面並通過請求標頭將首選語言發送到服務器。服務器僅渲染首選語言的翻譯文本。這[線程]（http://stackoverflow.com/questions/2336785/set-language-within-a-django-view）談到在Django方面的切換語言。 – ZZY 2014-11-04 08:19:37

ZZY，我正在使用JavaScript來避免頁面刷新。我肯定不希望刷新頁面。在數據發送到數據庫之前，JS用於動態顯示timspan。 – user3354539 2014-11-04 08:26:32

簡短的回答是你不能那樣做。

由於客戶端/服務器端的關係。

嘗試在您的項目中使用include，這種方式多次調用代碼，但是在項目中只有一個代碼引用。

希望能幫到你。

來源

2014-11-29 22:11:27 user4307426

實際上這不是真的，我能夠通過我下面描述的指示來實現他的目標，但是我懷疑他甚至會努力去嘗試。 – andrean 2014-12-27 07:11:00

-1

爲了簡化的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); 
}

但是一個更好的問題是，你怎麼能指望這個工作？ Javascript是在用戶瀏覽器內執行的，而Django模板引擎正在處理服務器端的這些標籤。因此，當您的HTML到達瀏覽器時，您的所有模板語法已被替換爲適當的內容，並且您使用JavaScript插入的任何其他標記將被視爲常規字符串。

編輯：更新的代碼來處理默認的英文情況。

EDIT2：好吧，我想我得到了它，我不明白你打算如何它的工作，所以在這裏它是：

我想你已經在你的settings.py這個元組，如果不添加：

LANGUAGES = (
    ('en', 'English'), 
    ('de', 'German'), 
    ('es', 'Spanish'), 
    ... 
    ... 
)

確保您MIDDLEWARE_CLASSES包括'django.middleware.locale.LocaleMiddleware'
用一個函數來渲染你的模板，該函數會將RequestContext傳遞到你的模板上下文中，例如將會確實地完成這項工作。

這裏是我用來展示它是如何工作的樣本模板：

{% 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>

這裏會發生什麼事是，在服務器端，我們預填充一個JavaScript對象與可用的語言代碼爲鍵和另一個對象，因爲它的值包括4個子鍵：月，月，年和年。這些鍵中的每一個都將包含已經翻譯過的單詞，因此我們只需在對象內部進行查找，然後獲取輸出。這是由它輸出呈現的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>

而且在我的JavaScript控制檯，我得到這個輸出（因爲我手動調用dateCalculation('es')）：

mes 
meses 
año 
años

來源

2014-11-04 08:04:49 andrean

我認爲user3354539將js代碼嵌入到html中。他的服務器渲染代碼中所有語言的翻譯。然後在客戶端，js函數選擇使用哪個文本 – ZZY 2014-11-04 08:22:25

andrean，我無法讓這個替換代碼工作！我在問題中提供的示例javascript確實有效，並且被觸發以動態顯示更改的語言中的日期時間範圍。但是我需要讓代碼比現在更可靠。 – user3354539 2014-11-04 08:24:43

@ user3354539：我測試了代碼，因爲它粘貼在這裏，當我'console.log'變量時，我得到正確的輸出。檢查你是否正確複製了它，或者如果你另外修改了它，請確保你沒有引入其他問題。 – andrean 2014-11-04 08:43:31

爲了避免頁面清爽，你可以把譯文在JSON文件中，如{"en":{"month":"xxx","months":"xxx"}, "ar":{}}。使用AJAX即時獲取文件。或者把翻譯放在一個專用的JS文件中。或者檢出Django文檔https://docs.djangoproject.com/en/dev/topics/i18n/translation/#internationalization-in-javascript-code。

來源

2014-11-04 08:34:36 ZZY

ZZY，這仍然會給我提供難以維護的代碼。如果我在我的項目中添加語言，我將不得不添加到您的建議代碼中。 – user3354539 2014-11-04 22:14:22

Django模板 - 服務器端django標籤的客戶端操縱

回答

相關問題