Skip to content

Instantly share code, notes, and snippets.

@MikaelPorttila

MikaelPorttila/app.html

Created April 1, 2016 06:31
Show Gist options
  • Save MikaelPorttila/daee633c39b5a293d9038aa980cc1a82 to your computer and use it in GitHub Desktop.
Save MikaelPorttila/daee633c39b5a293d9038aa980cc1a82 to your computer and use it in GitHub Desktop.
Download ZIP
Derp
Raw
app.html
<template>
<div repeat.for="item of items">
<label>
${item.value}:
<input type="number"
value.one-way="item.index"
change.delegate="updateIndex(item, $event.target.value)">
</label>
</div>
</template>
Raw
app.js
export class App {
items = [
{ index: 0, value: 'a' },
{ index: 10, value: 'b' },
{ index: 20, value: 'c' },
{ index: 30, value: 'd' },
{ index: 40, value: 'e' }];
updateIndex(item, index) {
item.index = parseInt(index, 10);
this.items.sort((a, b) => a.index - b.index);
}
}
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>
Raw
styles.css
/* todo: add styles */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment