0

サイトをバイリンガルにするために、knockout.js を使用しようとしています。ユーザーがクリックして言語を切り替えることができる典型的なフラグがあります。

私が使用しているノックアウト.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>

この件についてご協力いただき、誠にありがとうございます。

4

1 に答える 1