Skip to content

Instantly share code, notes, and snippets.

@niieani

niieani/app.html

Created March 25, 2016 00:01
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save niieani/ce252a8c24716e5d3620 to your computer and use it in GitHub Desktop.
Save niieani/ce252a8c24716e5d3620 to your computer and use it in GitHub Desktop.
Download ZIP
Aurelia Gist [computedFrom not applying]
Raw
app.html
<template>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li repeat.for="row of router.navigation" class="${row.isActive ? 'active' : ''}">
<a data-toggle="collapse" data-target="#bs-example-navbar-collapse-1.in" href.bind="row.href">${row.title}</a>
</li>
</ul>
<div class="loader" if.bind="router.isNavigating">
<i class="fa fa-spinner fa-spin fa-2x">loading</i>
</div>
</div>
</nav>
<div class="page-host">
<router-view></router-view>
</div>
</template>
Raw
app.js
import {Router, RouterConfiguration} from 'aurelia-router'
export class App {
router: Router;
configureRouter(config, router) {
config.title = 'Aurelia';
config.map([
{ route: 'computed', name: 'computed', moduleId: 'computed', nav: true, title: 'computed' },
{ route: '', name: 'else', moduleId: 'else', nav: true, title: 'else' }
]);
this.router = router;
}
}
Raw
computed.html
<template>
<h5>random: ${random}</h5>
</template>
Raw
computed.js
import {computedFrom} from 'aurelia-framework'
export class Computed {
nothing = null
@computedFrom('nothing')
get random() {
return Math.random()
}
}
Raw
else.html
<template>
<h5>else</h5>
</template>
Raw
else.js
export class Else {
}
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://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/jspm_packages/system.js"></script>
<script src="https://cdn.rawgit.com/jdanyow/aurelia-bundle/v1.0.3/config.js"></script>
<script>
System.import('aurelia-bootstrapper');
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment