Thẻ HTML trong bản dịch i18next

Question

Tôi đang sử dụng i18next để cấp nguồn i18n cho nhật ký web của mình. Nó hoạt động tốt trên nội dung chỉ có văn bản, nhưng khi tôi cố gắng dịch nội dung bao gồm đánh dấu HTML, nó hiển thị đánh dấu thô khi tôi dịch văn bản.

Như một ví dụ, đây là một đoạn đánh dấu từ một bài đăng không hoạt động như mong đợi:

đang

<div class="i18n" data-i18n="content.body"> 
    In Medellín they have many different types of <i>jugos naturales</i>&nbsp;(fruit juice) ... <br /> 
    <br /> 
    ... 
</div> 

Bản dịch trông như thế này:

var resources = { 
    "en": ..., 
    "es": { 
    "translation": { 
     "content": { 
     "body": "En Medellín hay varios tipos diferentes de <i>jugos naturales</i> ... <br /><br /> ... " 
     } 
    } 
    } 
} 

i18n.init({"resStore": resources}, function(t) { 
    $('.i18n').i18n(); 
}); 

Khi dịch được hiển thị, thẻ HTML được thoát và xuất dưới dạng văn bản:

En Medellín hay varios tipos diferentes de <i>jugos naturales</i>...<br /><br /> 

Làm cách nào để i18next thay đổi thứ e HTML của các phần tử đã dịch?

Answer 1

Để thực hiện việc này, bạn phải tiền tố data-i18n thuộc tính của các yếu tố bạn muốn dịch với [html]:

<div class="i18n" data-i18n="[html]content.body"> 

Nguồn: i18next.jquery.js

Answer 2

Từ documentation:

Gợi ý 3: Thoát:

// given resources 
{   
    'en-US': { 
    translation: { 
     key1: Not escaped __nameHTML__, 
     key2: Escaped __name__ 
    } 
    } 
}; 

i18n.t("key2", { name: '', escapeInterpolation: true }); // -> Escaped <tag> 
i18n.t("key1", { name: '', escapeInterpolation: false }); // -> Not escaped <tag> 

Thêm hậu tố 'HTML__' vào giá trị của bạn sẽ ngăn việc thoát ngay cả khi tùy chọn được đặt như vậy.

Bạn có thể bật thoát trên init i18n.init({escapeInterpolation: true}); hoặc bằng cách chuyển tùy chọn để t hoạt động như trong mẫu.

Answer 3

Bạn cần phải tắt thoát:

i18n.t("key", { 'interpolation': {'escapeValue': false} })

Answer 4

i18n.t('key',{dateStr: date, interpolation: {escapeValue: false}}) 

làm việc cho tôi nếu date = '15/10/2020' , dấu gạch chéo giữ cũng