Firefox OS 앱에서 언어를 전환하는 방법은 무엇입니까?

Question

여러 언어로 내 앱을 지원해야하며 드롭 다운에서 언어를 선택하는 기능을 사용자에게 제공하고 싶습니다.

지금, 나는 Firefox OS Boilerplate app 일하고 다음과 같이 나는 홈 화면에 <select>을 추가 한 :

<p> 
    <label data-l10n-id="language">Language: </label> 
    <select id="language"> 
     <option value="en">English</option> 
     <option value="fr">French</option> 
     <option value="es">Spanish</option> 
    </select> 
</p> 

내가 설정 바닐라 JS에 대한 간단한 이벤트 리스너도 있습니다.

MDN 문서를 검색했지만 anywere가 언어 전환에 대해 언급 한 것을 찾지 못했습니다.

프로그래밍 방식으로 Firefox OS 앱에서 언어를 변경하는 방법을 알려줄 수 있습니까?

Answer 1

하나의 접근 방식을 사용하면 사용자가 응용 프로그램의 언어를 결정하게됩니다. 응용 프로그램 (예 : localStorage)에 사용자의 선택을 저장할 수 있으며 페이지를로드 할 때 언어 값을 확인하고 해당 동작을 수행하여 해당 언어의 모든 텍스트를 표시 할 수 있습니다.

var translations = new Object(); 
translations.en = { 
    text1: 'The first text', 
    text2: 'The second text' 
}; 
translations.es = { 
    text1: 'El primer texto', 
    text2: 'El segundo texto' 
}; 

을 그리고 당신의 페이지는 다음과 같습니다 : 외부 라이브러리를 사용하지 않고이를 구현하려면 모든 번역으로 전역 객체를 가질 수있는 페이지를로드하고 언어를 가진 후,

<span data-translate="text1"></span> 
<span data-translate="text2"></span> 

그래서 변수 (예 : lang)에서 사용자가 선택한 경우 data-translate 속성이있는 모든 요소를 ​​반복하고 내용을 동적으로 설정합니다.

var items = document.querySelectorAll('[data-translate]'); 
for (var i = 0; i < items.length; ++i) { 
    var index = items[i].getAttribute('data-translate'); 
    items[i].innerHTML = translations[lang][index]; 
} 

는 또 다른 방법은 (시스템의 언어에서) 자동으로 사용자의 언어를 감지 라이브러리를 사용하여 별도의 파일에 저장되어있는 해당 값으로 페이지 (이러한 표시)의 모든 번역 요소를 (대체합니다). 예를 들어 webL10n을 확인하십시오.

webL10n을 사용하면 첫 번째 방법을 더 쉽게 구현할 수 있다고 생각합니다.