Cervajz

Cervajz

Use .html.heex file for Phoenix.Component template (instead of ~H)

Hello,

I’d like to use Phoenix function component but without the HEEX code being part of the module’s code - the HTML template is pretty long to be included in the Elixir module itself and would make the navigation and editing expierence somewhat hard.

Is there any way I could render the HTML from an external .html.heex file from within the function body, please?

Something like this

defmodule DashboardWeb.Components.Navigation do
  use Phoenix.Component

  def main_navigation(assigns) do
    # Render .html.heex file here instead of the ~H sigil
  end
end

Directory structure:

I haven’t found any information in the documentation or in the source code and I failed all of my tries rendering the file view Phoenix.View or LiveView or even via Phoenix.Template :sweat_smile:

In Phoenix.LiveComponent this was automatically done when the render function was not defined in the component module (via Phoenix.LiveView.Renderer.before_compile) but I can’t figure out how to elegantly do it in the function component world.

Thank you and have a nice one :slight_smile:

Most Liked

seb3s

seb3s

Hello,
sure it functions

I do this in my code :

defmodule VtmeetWeb.Component do
  use Phoenix.Component
 
  def avatar(assigns) do
    Phoenix.View.render(VtmeetWeb.LiveView, "component/avatar.html", assigns)
  end
end

And my dir is
image

Hope this helps,
cheers
Sébastien

josevalim

josevalim

Creator of Elixir

Yes, in a nutshell this feature is not yet supported.

seb3s

seb3s

Currently the components I used are within liveview. So I’ve not tried what you want to accomplish.

Here is my liveview module

defmodule VtmeetWeb.LiveView do
  use VtmeetWeb, :subtemplate_view
end

and the subtemplate_view def within vtmeet_web.ex :

  def subtemplate_view do
    quote do
      use Phoenix.View,
        root: "lib/vtmeet_web",
        namespace: VtmeetWeb,
        pattern: "**/*"

      # Import convenience functions from controllers
      import Phoenix.Controller, only: [get_flash: 1, get_flash: 2, view_module: 1]

      # Include shared imports and aliases for views
      unquote(view_helpers())
    end
  end

Note the pattern which allow to find the template in subdirectories (maybe that’s what is missing in your case).

Sébastien.

Where Next?

Popular in Questions Top

aadeshere1
I have a another noob question about loop. Since elixir is immutable, while loop is not directly possible. total = 10 while total != 0 ...
New
Emily
I have VueJS GUIs with the project generated using Webpack. I have Elixir modules that will need to be used by the VueJS GUIs. I forese...
New
greenz1
I have a phoenix application from which a user can download multiple(5-6) files of size 1MB. I couldn’t find anything related to sending ...
New
mgjohns61585
Could someone help me? I’m making my first elixir program, number guessing game. I can’t figure out how to convert the user’s guess from ...
New
fireproofsocks
Forgive me if this is obvious, but how does one delete a database record WITHOUT selecting it first? Ecto.Repo — Ecto v3.14.0 has exampl...
New
aalberti333
As the title describes, I’m trying to run Enum.map() over a list of key/value pairs, where the value is a map. My data looks like this: ...
New
lucidguppy
I have a super simple question about elixir - how would I take a file like this foo bar baz and output a new file that enumerates th...
New
bsollish-terakeet
Credo is smart enough to check for (something like) this: assert length(the_list) == 0 with this response: Checking if an enum is empt...
New
openscript
Hello! Sorry for this astonishing simple question, but I’m really stuck. I try to set up the intellij-elixir plugin, but I don’t know ho...
New
vonH
In asking this question I am more interested about the expressiveness of the language itself and less concerned about the availability of...
New

Other popular topics Top

vertexbuffer
Hello, can anybody help here..? I have a list of players and I what to delete an element, but every for loop the list is reverting to ori...
New
hariharasudhan94
lets say i have a sample like a = 20; b = 10; if (a > b) do {:ok, "a"} end if (a < b) do {:ok, b} end if (a == b) do {:ok, "equa...
New
danschultzer
None of the current solutions worked well for me, so I went ahead and built a user management system from scratch. This project took far...
548 29703 241
New
mcarvalho
What is the difference between System.get_env and Application.get_env? For example, what are best practices to use one versus another.
New
gshaw
What is the idiomatic way of matching for not nil in Elixir? E.g., First way: defp halt_if_not_signed_in(conn, signed_in_account) when...
New
ovidiubadita
Hey all, I discovered Elixir and I love it. I always wanted to learn a functional programming and I intended to go for Haskell, but afte...
New
rms.mrcs
Hi, I need to transform a list of numbers into a map where the keys are the indexes and the values are the original values of the list. ...
New
romenigld
I am trying to run a deploy with docker and I successfully runned with this command: docker build -t romenigld/blog-prod . but when I t...
New
komlanvi
Hi everyone, I was playing with phoenix liveView but I run into an issue. I have a form and want to validate each input text when the te...
New
shijith.k
I am trying to start a new phoenix project with elixir 1.9, but mix phx.new does not work. It says that ** (Mix) The task "phx.new" could...
New

We're in Beta

About us Mission Statement