无法翻译<a> tag inside div by i18next library

时间:2017-05-24 09:24:31

标签: localization i18next

</head>

<body>
    <div id="add">

        <div data-i18n="key">You have to <a href="">Click here</a> to find better result</div>

// If I am using that way that translate complete div and remove link from my text.

    <div data-i18n="key">You have to</div> <a href="" data-i18n="key2">Click here</a> <div data-i18n="key3">to find better result</div>

// If I am using that way code working fine but for this I have to use 3 keys for single sentences. Is it possible to fix this by single key ?

    <script>
        i18next
        i18next.use(window.i18nextBrowserLanguageDetector)
        i18next.use(window.i18nextXHRBackend)

        .init({
            debug: true,
            tName: 't',
            handleName: 'localize',
            selectorAttr: 'data-i18n',
            targetAttr: 'i18n-target',
            optionsAttr: 'i18n-options',
            useOptionsAttr: true,
            parseDefaultValueFromContent: true,
            initImmediate: true,
            fallbackLng: false,
            interpolation: {
                "escapeValue": true,
                "prefix": "{{",
                "suffix": "}}",
                "formatSeparator": ",",
                "unescapePrefix": "-",
                "nestingPrefix": "$t(",
                "nestingSuffix": ")"
            },

            detection: {
                order: ['querystring', 'cookie', 'navigator', 'htmlTag'],
                lookupCookie: 'i18next',
                lookupLocalStorage: 'i18nextLng',
                caches: ['cookie'],
            },

            "backend": {
                "loadPath": "/locales/{{lng}}/{{ns}}.json"
            }

        }, function(err, t) {
            jqueryI18next.init(i18next, $);
            $('#add').localize();
        });

    </script>

</body>

This code translate complete div

1 个答案:

答案 0 :(得分:0)

a)将标签添加到翻译后的文本中。 - &GT;一键

"key": "You have to <a href="">Click here</a> to find better result"

<div data-i18n="html:key">You have to <a href="">Click here</a> to find better result</div>

设置innerHTML

b)将a标签插入到翻译中。 - &GT;两把钥匙

"key": "You have to {{link}} to find better result"

使用:

$('#add').localize({ link: '<a href="">Click here</a>', interpolation: { escapeValue: false }});

翻译点击这里直接使用i18next.t