Assemble / Handlebars Sort Order

Question

I created a simple dynamic navigation using the example from the the Assemble FAQs

{{#each pages }}
  {{#is data.section "main"}}
    <li{{#is ../../page.dest this.dest}} class="active"{{/is}}>
      <a href="{{relative ../../page.dest this.dest}}">{{data.menutitle}}</a>
    </li>
  {{/is}}
{{/each}}

How does one achieve sort-order? Right now the links seem to be in random order. They seem to be in the alpha-order of the page alias (index.html).

They should be:

Index Products Find Us

but what's rendered is:

Find Us Index Products

Answer 1

Here's a link to the Assemble documentation that has a section on using withSort.

I'd use something like:

{{#withSort pages data.sortOrder}}
    {{#is data.section "main"}}
        <li{{#is ../../page.dest this.dest}} class="active"{{/is}}>
            <a href="{{relative ../../page.dest this.dest}}">{{data.menutitle}}</a>
        </li>
    {{/is}}
{{/withSort}}

Where sortOrder is defined at page level, for example having this in your page templates:

---
title: Index
sortOrder: 0
---

etc.