在工具提示中渲染 Shiny.i18n 翻译

问题描述

我想在我的应用程序中使用shiny.i18n，它使用工具提示提供有关某些元素的更多信息（使用两种类型的工具提示，使用tipify 或bsTooltip）。但是，我找不到如何集成两者，并且工具提示未正确呈现。

举个例子：

library(shiny)
library(shinyjs)
library(shinyBS)
library(shiny.i18n)

i18n <- Translator$new(translation_csvs_path = "data_translation/")
i18n$set_translation_language("en")

ui <- fluidPage(
  useShinyjs(),shiny.i18n::usei18n(i18n),div(style = "float: left;",selectInput('selected_language',i18n$t("Change language"),choices = i18n$get_languages(),selected = i18n$get_key_translation())
  ),mainPanel(
    i18n$t("This is some text without a tooltip"),textOutput("Text"),bsTooltip("Text",i18n$t("This is some text"),placement="right",trigger = "hover",options=list(container="body")),tipify(
    actionButton("Button","",icon = icon("house-user")),i18n$t("This is a button"),options=list(container="body"))
))


server <- function(input,output,session) {
  observeEvent(input$selected_language,{
    shiny.i18n::update_lang(session,input$selected_language)
  })
  output$Text <- renderText({i18n$t("This is some text with a tooltip")})
}

shinyApp(ui,server)

文件 translate_fr.csv：

"en","fr" 
"Hello","Bonjour" 
"This is some text without a tooltip","Ceci est un texte sans tooltip" 
"This is some text with a tooltip","Ceci est un texte avec tooltip"
"This is a button","Ceci est un bouton" 
"This is some text","Ceci est un texte" 
"Change language","Changer de langue"

返回：

虽然工具提示应该只包含“这是一个按钮”。我对这些工具很陌生 - 我错过了什么？

解决方法

问题是工具提示和提示不支持 HTML。这就是您的工具提示显示由 Shiny.18n 创建的原始 HTML 的原因。

有两种方法可以实现您想要的。

第一个是使用来自shinyBS 包的popovers。这些支持 HTML 并将实现您正在寻找的语言功能。

另一个是将服务器端的工具提示呈现为闪亮。这样，在创建翻译时就不会涉及 HTML。这种方式甚至可以让您使用您要求的提示/工具提示。

这个问题的原因是，shiny.18n有两种技巧来实现翻译。第一个是浏览器端。正如您显示的那样，shiny.18n 正在翻译周围包裹一个 span 标签，以便以后可以在浏览器中使用 JavaScript 对其进行修改。

另一种方法是在服务器端渲染所有新内容。这样就不需要 HTML，因为这个过程无论如何都不会发生在浏览器上。