Knockout.js для переключения языков на двуязычном сайте

Question

Knockout.js для переключения языков на двуязычном сайте

0

Я пытаюсь использовать knockout.js, чтобы сделать мой сайт двуязычным. У меня будут типичные флаги, которые пользователи могут щелкнуть, чтобы переключить язык.

Реализация knockout.js, которую я использую, такова: https://github.com/tfsjohan/Knockout-Localization-Binding

Я изменил его совсем немного, поскольку оригинал был излишним для того, что мне было нужно.

То, что я пытаюсь сделать, - это создать демонстрацию набора радиокнопок, который я могу использовать для имитации переключения языка. Когда я нажимаю на кнопку, я хочу, чтобы текст изменился на мой язык выбора.

Вот мой JS:

var resources = {
pLangSelect: {
    en: 'Select your language:',
    es: 'Selecciona tu idioma:'
},
welcome: {
    en: 'Hello <strong>Christopher</strong>! You live in London.',
    es: 'Hola, ¡<strong>Cristóbal</strong>! Vives en Bogotá.'
}
};

Вот мой HTML:

<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<title>Knockout Localization Binding Demo</title>
</head>
<body>
<div>
    <div data-bind="restext: 'pLangSelect'"></div>
    <labal for="eng">English</labal>
    <input type="radio" id="eng" name="lang-select">
    <labal for="eng">Español</labal>
<input type="radio" id="esp" name="lang-select">
<div data-bind="reshtml: { key: 'welcome' }"></div>
</div>

<script src="resources.js"></script>
<script src="knockout-2.3.0.js"></script>
<script src="../src/ko.localizationbinding.js"></script>
<script>
    var choice = document.getElementById('esp');
    var locale;

    if (choice.selected) {
        locale="en";
    } else {
        locale="es";
    }

    choice.onclick = function(e) {
        if(choice.checked)
            locale = 'en';
        else
            locale = 'es';
    }

    var vm = {
    name: ko.observable(),
    city: ko.observable()
    };

    ko.applyBindings(vm);
</script>
</body>
</html>

Большое спасибо за вашу помощь в этом вопросе.

Chris Fitzgerald 20 окт. 2013, в 01:50

Источник

0

Какой у тебя конкретный вопрос? Кстати, если бы я делал это, я бы просто использовал отдельные шаблоны для каждого языка, вводя их с опцией name переменной в привязке template .
ebohlman 20 окт. 2013, в 01:29
0

Если вы хотите, чтобы представление обновлялось при изменении языкового стандарта, вам нужно изменить его на наблюдаемый, также библиотека Knockout-Localization-Binding сможет использовать это в своих привязках.
Anders 20 окт. 2013, в 08:23

Теги:

javascript

html

knockout.js

client-side

1 ответ

Ещё вопросы

Какой у тебя конкретный вопрос? Кстати, если бы я делал это, я бы просто использовал отдельные шаблоны для каждого языка, вводя их с опцией name переменной в привязке template .
Если вы хотите, чтобы представление обновлялось при изменении языкового стандарта, вам нужно изменить его на наблюдаемый, также библиотека Knockout-Localization-Binding сможет использовать это в своих привязках.

Dave Hilditch · Answer 1 · 2014-11-12T17-02-00.000Z

Крис - есть новое двуязычное решение для javascript, которое вы можете использовать - он невероятно прост в использовании - plug n play - просто разделите две строки с помощью //, например languageone//languagetwo и он покажет правильный для пользователя в соответствии с языком, на котором они Вы выбрали.

Он также работает с большими блоками текста, используя следующий формат:

[[languageone
languageone
languageone///languagetwo
languagetwo
languagetwo]]

www.affiliatewebdesigners.com/product/bilingual-javascript/