光沢のあるモーダルウィンドウはjsとcssを受け入れません

Question

私のShinyアプリケーションはコードを表示します。私はハイライトjsライブラリを使用するようにフォーマットされたコードを表示したいです。私はモーダルウィンドウの外で動作するようにしましたが、内部では動作しませんでした。 modalDialog関数は、私のcssとjs入力を受け入れていないようです。

モーダルウィンドウなしで、動作するコード・チャンク：

library(shiny) 
shinyApp(
    ui = basicPage(
    includeScript("/Users/stani/GitHub/bamlss.vis/inst/srcjs/highlight.pack.js"), 
    includeCSS("/Users/stani/GitHub/bamlss.vis/inst/srcjs/default.css"), 
    HTML('<script>hljs.initHighlightingOnLoad();</script>'), 
    tags$pre(tags$code(' 
         for (i in 1:10) { 
         print(i) 
         }')) 
), 
    server = function(input, output) {} 
) 

出力がthisのように見える、我々はその書式設定の作品を見ることができます。

私はモーダルウィンドウを表示するには、このコードを使用する場合しかし、それは動作しません：

library(shiny) 

shinyApp(
    ui = basicPage(
    actionButton("show", "Show modal dialog") 
), 
    server = function(input, output) { 
    observeEvent(input$show, { 
     showModal(modalDialog(
     title = "Important message", 
     # Include JS, CSS for syntax highlighting 
     includeScript("/Users/stani/GitHub/bamlss.vis/inst/srcjs/highlight.pack.js"), 
     includeCSS("/Users/stani/GitHub/bamlss.vis/inst/srcjs/default.css"), 
     HTML('<script>hljs.initHighlightingOnLoad();</script>'), 
     tags$pre(tags$code(' 
for (i in 1:10) { 
    print(i) 
}')) 
    )) 
    }) 
    } 
) 

その代わり、出力がthisのように見えます。コードは表示されますが、フォーマットされていないことがわかります。どうして？

Answer 1

問題は、jsスクリプトを読むタイミングが間違っていることでした。それは一般的なUIで呼び出される必要があります。誰かが同じ問題を抱えた場合、私の解決策は次のとおりです。

library(shiny) 

shinyApp(
    ui = basicPage(
    includeCSS("/Users/stani/GitHub/bamlss.vis/inst/srcjs/default.css"), 
    includeScript("/Users/stani/GitHub/bamlss.vis/inst/srcjs/highlight.pack.js"), 
    actionButton("show", "Show modal dialog") 
), 
    server = function(input, output) { 
    observeEvent(input$show, { 
     showModal(modalDialog(
     title = "Important message", 
     # Include JS, CSS for syntax highlighting 
     tags$pre(tags$code(' 
          for (i in 1:10) { 
          print(i) 
          }')), 
     HTML('<script>$("pre code").each(function(i, block) { 
      hljs.highlightBlock(block); 
     });</script>') 
    )) 
    }) 
    } 
)