Use layout as reusable code component?

[nicolasfranck]

Currently layouts are used by child templates.

e.g.

templ List() {
  <ul>
  {children...}
 </ul>
}

templ Li() {
  List() {
    <li>first</li>
    <li>second</li>
  }
}

But once compiled, I see no way to call the layout and supply a child templ.Component (so the other way around).
That would make components more "dynamically" reusable.

e.g. (doesn't work)

List(Li()).Render(context.TODO, os.Stdout)

[joerdav]

This is entirely up to the developer. If you want to create layouts to be used like that you should to the following:

templ List(c templ.Component) {
  <ul>
  {c}
 </ul>
}
...
List(Li()).Render(context.TODO, os.Stdout)

If you want to keep your templ file the same you can include your Li component as the child to the layout as follows:

List().Render(templ.WithChildren(context.Background(), Li()), os.Stdout)

I would recommend the first option though.

[nicolasfranck]

Interesting!

[grantjayy]

templ List(c templ.Component) {
  <ul>
  {c}
 </ul>
}

@joerdav This gives me a type error of cannot use c (variable of type templ.Component) as string value in argument to templ.JoinStringErrs [IncompatibleAssign]

I am using the lastest version of templ. Is there something else that needs to be done to make this work?

[Riu]

templ List(c templ.Component) {
  <ul>
  @c
 </ul>
}

[joerdav]

Sorry I think I typed that on my phone.