Recursive structure using Component

Template used

component Menu menu={{ menu }}

Component used

This Component is a composed of a list of items which can contain another Component called "Menu"

ul
  for child in menu.children
    li
      a href="#{{ child.text }}" lk-click={{ toggle(child) }}
        {{ child.text }}
      if child.children
        if child.open
          " ▴"
          # The Component Menu call itself
          component Menu menu={{ child }}
        else
          " ▸"

If you want to create a recursive structure with Likely.js you should create a Component with an uncompiled template string.

var menuTemplateString = document.getElementById('menuComponent').textContent;
var menuComponent = likely.Component("Menu", menuTemplateString);

The Component Menu will register it's existence before compiling the template string. By doing so a reference to itself within the template is possible.

Data