arjanvanderleden/app.html

## app.html
<template>
  <select value.bind="savedItemIndex">
    <option repeat.for="item of savedItems" value.bind="$index">${index} (${item.numberproperty})</option>
  </select> (${currentLanguage})


</template>

## app.js
import {inject} from 'aurelia-dependency-injection';
import {bindable} from 'aurelia-binding';


export class App {
  savedItems=[]
  @bindable savedItemIndex ;

  constructor(){
  }

  savedItemIndexChanged(){
        console.log(this.savedItems[this.savedItemIndex].numberproperty)
  }

  saveItem(){
        var t = {numberproperty:this.savedItems.length};
        this.savedItems.push(t);
  }

}


## index.html
<!doctype html>
<html>
  <head>
    <title>Aurelia</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body aurelia-app="main" class="container">
    <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/babel.js"></script>
    <script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script>
    <script>
      require(['aurelia-bootstrapper']);
    </script>
  </body>
</html>

## main.js
export function configure(aurelia) {
  aurelia.use.standardConfiguration()
    .developmentLogging()
  aurelia.start().then(() => aurelia.setRoot());
}
	<template>
	<select value.bind="savedItemIndex">
	<option repeat.for="item of savedItems" value.bind="$index">${index} (${item.numberproperty})</option>
	</select> (${currentLanguage})



	</template>
	import {inject} from 'aurelia-dependency-injection';
	import {bindable} from 'aurelia-binding';


	export class App {
	savedItems=[]
	@bindable savedItemIndex ;

	constructor(){
	}

	savedItemIndexChanged(){
	console.log(this.savedItems[this.savedItemIndex].numberproperty)
	}

	saveItem(){
	var t = {numberproperty:this.savedItems.length};
	this.savedItems.push(t);
	}

	}
	<!doctype html>
	<html>
	<head>
	<title>Aurelia</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	</head>
	<body aurelia-app="main" class="container">
	<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/babel.js"></script>
	<script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script>
	<script>
	require(['aurelia-bootstrapper']);
	</script>
	</body>
	</html>
	export function configure(aurelia) {
	aurelia.use.standardConfiguration()
	.developmentLogging()
	aurelia.start().then(() => aurelia.setRoot());
	}