在 LiveView 中以编程方式组成 ~H 印记

Question

如何用变量填充部分或整个〜H sigil？ 我正在尝试使用它将一些现有的 html 表格标记插入 Liveview 页面。 我尝试了以下方法，但它们导致页面上出现“#{html_codes}”或“...”之类的文本，而不是在 Liveview 页面上插入表格。 如果有更好的方法可以在 LiveView 页面中插入任意 html 代码，我会全力以赴。

html_codes = """
  <table> .... </table>
"""

~H"""
   #{html_codes} or <%= html_codes %>
"""

Answer 1

从 Elixir Slack 频道收到了以下提示，并且成功了。

~H"""
<% = Phoenix.HTML.raw(html_codes) %>
"""

Answer 2

你需要做三件事：

1. 确保您尝试包含的变量使用~H语法

   html_codes = ~H""" <table> .... </table> """

2. 确保值在assigns变量中

   assigns = assign(assigns, html_codes: html_codes)

3. 在模板中，使用@assign_name语法引用值

   ~H""" <div><p>Here's a table:</p><%= @html_codes %></div> """

无论您是在render/1回调、函数组件还是单独的*.heex文件中，相同的语法都应该有效。