Programming Phoenix LiveView B2.0: P168 "Render the Demographic Form"

Community PragProg Customers
,
4

Regarding the second error your reported here @asibbald:

Error when I attempt to run the code I created following the text in B2.0:

[error] #PID<0.18693.0> running PentoWeb.Endpoint (connection #PID<0.18691.0>, stream id 1) terminated
Server: localhost:4000 (http)
Request: GET /survey
** (exit) an exception was raised:
** (ArgumentError) assign @content not available in eex template.

When I run the server in the stateful_components directory, as well as the stateless_components directory, I able to run the server successfully and do not see this error.

This error means that in the pento_web/live/demographic_live/form_component.html.leex file, there is some code that looks something like this <%= @content %>, and that there is no such :content key in the socket assigns of the supporting live view/component.

There is a portion of the Stateless Components chapter that instructs you to add this line of code to the pento_web/live/demographic_live/form_component.html.leex file, like this:

<div class="hero"><%= @content %></div>

You’re meant to do so after adding the following to this file’s pento/lib/pento_web/live/survey_live.html.leex call to render the form component like this:

<section class="row">
  <%= live_component @socket,
    PentoWeb.DemographicLive.FormComponent,
    content: "Hello to the Demographic Form Component" %>
</section>

This would have added the key :content to the form component’s socket assigns and therefore made the @content assignment available in the form component’s template.

All of this is on/around page 165, under the “Build The Demographic Form” heading.

So, what I think happened is:

  • You added the code as you were instructed to on page 165
  • Then, later on, you removed the content: argument in the call to live_component here:
# pento/lib/pento_web/live/survey_live.html.leex
<section class="row">
  <%= live_component @socket,
    PentoWeb.DemographicLive.FormComponent,
    content: "Hello to the Demographic Form Component" %>
</section>
  • You did not remove the call to render @content in the form component’s template here:
# pento_web/live/demographic_live/form_component.html.leex

<div class="hero"><%= @content %></div>

Let me know if that makes sense!