Skip to content

Instantly share code, notes, and snippets.

@ormasoftchile

ormasoftchile/app.html

Last active November 28, 2017 16:04
Show Gist options
  • Save ormasoftchile/51a114adefc34914818bc4339f482410 to your computer and use it in GitHub Desktop.
Save ormasoftchile/51a114adefc34914818bc4339f482410 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
app.html
<template>
<ul class="side-navigation z-depth-2" repeat.for="menu of menus">
<template if.bind="menu.hasSubMenuItems" >
<li class="collapsible-accordion">
<ul md-collapsible="accordion: true;">
<li class="list-level-two">
<div class="collapsible-header">${menu.menuItem.title}</div>
<div class="collapsible-body">
<ul>
<li repeat.for="menuItem of menu.subMenuItems" class="list-level-three">
<a href.bind="menuItem.title">${menuItem.title}</a>
</li>
</ul>
</div>
</li>
</ul>
</li>
</template>
</ul>
</template>
Raw
app.js
export class App {
menus = [
{
hasSubMenuItems: true,
menuItem: { title: 'lalala' },
subMenuItems: [ { pageId: '1', title: 'One' }, { pageId: '2', title: 'Two' }, { pageId: '3', title: 'Three' } ]
}
];
}
Raw
index.html
<!doctype html>
<html>
<head>
<title>Aurelia</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body aurelia-app>
<h1>Loading...</h1>
<script src="https://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/config.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script>
<script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script>
<script>
require(['aurelia-bootstrapper']);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment