如何硬編碼來自 javascript 消息的文本

Question

我們的應用程序已國際化並更改為不同的語言。 出於這個原因，我們必須對所有消息進行硬編碼。 我們如何為 javascript 中的消息做到這一點？

這就是我們在 html 消息中所做的。

<span th:text="#{listTable.deletedFromTable}">deleted</span>     

我們如何對 javascript 消息進行硬編碼。（更新表格）

$('#TableUpdate-notification').html('<div class="alert"><p>Update the Table.</p></div>');

Answer 1

您需要從一開始就將消息放入DOM ，但不顯示它們。 將這些文本放在span標簽中，每個標簽都有一個唯一的id和th:text屬性——您可以將它們添加到文檔的末尾：

<span id="alertUpdateTable" th:text="#{listTable.updateTable}" 
     style="display:none">Update the Table.</span>

這將確保您的國際化模塊也將在此元素上發揮作用，並且即使未顯示文本也會被翻譯。

然后在您想要使用該警報的那一刻，獲取隱藏的文本並將其注入您需要的地方：

$('#TableUpdate-notification').html(
'<div class="alert"><p>' + $('#alertUpdateTable').html() + '</p></div>');

您要求提供另一個變體，您目前擁有：

$successSpan.html(tableItemCount + " item was deleted from the table.", 2000); 

然后，您將再次將此內容添加為非顯示span ，並為計數添加占位符：

<span id="alertTableItemDeleted" th:text="#{listTable.itemDeleted}" 
     style="display:none">{1} item(s) were deleted from the table.</span>

您應該確保您的翻譯也使用占位符。 然后按如下方式使用它，在運行時替換占位符：

$successSpan.html($('#alertTableItemDeleted').html().replace('{1}', tableItemCount));

您可以創建一個函數來處理此類占位符的替換：

function getMsg(id) {
    var txt = $('#' + id).html();
    for (var i = 1; i < arguments.length; i++) {
        txt = txt.replace('{' + i + '}', arguments[i]);
    }
    return txt;
}

然后這兩個例子將寫成如下：

$('#TableUpdate-notification').html(
'<div class="alert"><p>' + getMsg('alertUpdateTable') + '</p></div>');

$successSpan.html(getMsg('alertTableItemDeleted', tableItemCount));