Partials are the re-usable chunks of markup that you can include inside any template. Technically, there isn't anything different about partials, its just a layer for better code organization.

For demonstration, lets create a partial for the website header. Begin by executing the following ace command.

node ace make:view partials/header

# ✔  create    resources/views/partials/header.edge

Open the newly created file and paste the following code snippet inside it.

      <a href=""> AdonisJS </a>
      <li><a href="/"> Home </a></li>
      <li><a href="/about"> About </a></li>
      <li><a href="/contact"> Contact </a></li>

Now, create another template and include the header inside it using the @include tag.

<!DOCTYPE html>
<html lang="en">
    <p> Content comes here </p>

The contents of the header template will be copied to the parent template.

Dynamic Includes

The @include tag also works with dynamic values evaluated at runtime. For example:


Conditional Includes

Quite often you will find yourself wrapping partials inside conditional statements. For example: Include the partial to show comments, only if post has comments.


Using the includeIf tag, you can shorten the above code snippet to a single line.

@includeIf(post.comments, 'comments/list')

On this page