Skip to content

Instantly share code, notes, and snippets.

@lynsei

lynsei/app.html

Last active January 22, 2022 04:21
Show Gist options
  • Save lynsei/776416444a5e6ad4925e003d88bcdc33 to your computer and use it in GitHub Desktop.
Save lynsei/776416444a5e6ad4925e003d88bcdc33 to your computer and use it in GitHub Desktop.
Download ZIP
Aurelia "with" and "ref" https://github.com/aurelia/templating/issues/376 #lba #aurelia #doublebind #bind
Raw
app.html
<template>
<div repeat.for="company of companies">
<input type="text" value.bind="company.companyName" />
<input type="text" value.bind="company.experience" />
</div>
<button click.delegate="addfunc()">ADD</button>
<div repeat.for="company of companies">
<span>${company.companyName}</td>
<span>${company.experience}</td>
</div>
</template>
Raw
app.js
export class App {
obj = {
companyName: 'starbucks',
experience: 'coffee'
};
companies = [{
companyName: 'starbucks',
experience: 'coffee'
},{
companyName: 'esri',
experience: 'maps'
}]
addfunc(){
this.companies.push(this.obj);
console.log( this.companies)
}
}
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>
<!-- consolidated aurelia, babel, requirejs code as a portable version -->
<script src="https://gist.githubusercontent.com/lynsei/a4258463f59f46b0bd54eaf9f3f21c9b/raw/1382bb2f27f2ef037ce5cb700bbde3824388a652/aurelia-babel-requirejs-backend.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