Skip to content

Instantly share code, notes, and snippets.

@elitastic
Last active November 6, 2020 21:49
Show Gist options
  • Save elitastic/c773156ab7ab992f0707d59716f7742a to your computer and use it in GitHub Desktop.
Save elitastic/c773156ab7ab992f0707d59716f7742a to your computer and use it in GitHub Desktop.
aurelia-bind-vs-attached-3
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Dumber Gist</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<base href="/">
</head>
<!--
Dumber gist uses dumber bundler, the default bundle file
is /dist/entry-bundle.js.
The starting module is pointed to aurelia-bootstrapper
(data-main attribute on script) for Aurelia,
The aurelia bootstrapper then loads up user module "main"
(aurelia-app attribute on <body>) which is your src/main.ts.
-->
<body aurelia-app="main">
<script src="/dist/entry-bundle.js" data-main="aurelia-bootstrapper"></script>
</body>
</html>
{
"dependencies": {
"aurelia-bootstrapper": "^2.3.3"
}
}
<template>
<require from="./my-component"></require>
<p>
<button type="button" click.delegate="showComponent = true">Show Component</button>
</p>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
<my-component if.bind="showComponent" xy.bind="getIdx()"></my-component>
</template>
export class App {
showComponent = false;
idx = 0;
getIdx()
{
return this.idx++;
}
}
import {Aurelia} from 'aurelia-framework';
export function configure(aurelia: Aurelia) {
aurelia.use
.standardConfiguration()
.developmentLogging('info');
aurelia.start().then(() => aurelia.setRoot());
}
<template>
<div ref="divElement" style.bind="{ color: value ? '#333' : '#999' }">${value}</div>
</template>
import { bindable } from 'aurelia-framework';
export class MyComponent {
@bindable
xy: string;
value: string;
divElement: HtmlDivElement;
bind()
{
this.value = 'item-' + this.xy;
}
attached()
{
window.setTimeout(() => {
this.divElement.style.backgroundColor = this.divElement.innerHTML.startsWith('item')
? '#0a0'
: '#a00';
});
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment