jsobell

<template>
  <require from='thingy'></require>
  
  <h1>${message}</h1>
  <ul>
    <li repeat.for="option of allOptions">
      <input type="checkbox" checked.bind="selectedOptions" matcher.bind="matcher" model.bind="option">
      ${option.text}
      </li>
  </ul>

jsobell

<template>
  <h1>${message}</h1>
  <pre>data:[${data}]</pre>
  <ul>
    <!--
    <li repeat.for="user of users">
      ${user.login}
    </li>
    -->
  </ul>

jsobell

<template>
  <h1>${message}</h1>
  <button click.delegate="go()">go to second</button>
  <div>
  [[DEFAULT: <router-view name="primary"></router-view>]]
  </div>
  <div>
  [[SECONDARY:<router-view name="secondary"></router-view>]]
  </div>
</template>

jsobell

.

jsobell

<template>
    <select md-select="label: select a value" value.two-way="selectedValue">
      <option value="" disabled selected>select an item</option>
      <option value="item1">item 1</option>
      <option value="item2">item 2</option>
      <option value="item3">item 3</option>
      <option value="item4">item 4</option>
    </select>
    <div if.bind="selectedValue=='item1'">
      You've selected "item 1"

jsobell

<template>
  <form submit.delegate="submit()">
    <!--<ul><li repeat.for="error of controller.errors">${error.message}</li></ul>-->

    <div class="form-group">
      <label class="control-label" for="name">Name</label>
      <input type="text" class="form-control" id="name" placeholder="Name"
             value.bind="user.name & validate">
    </div>

jsobell

import { ValidationRules } from 'aurelia-validation';

export class Address {
  street; 
  city;
}

/*ValidationRules
  .ensure(a => a.street).required()
  .ensure(a => a.city).required()

jsobell

<template>
  <div>
  <a href="http://aurelia.io/hub.html#/doc/article/aurelia/validation/latest/validation-basics/9" target="top">Documentation</a>
  </div>
  <form submit.delegate="submit()" novalidate autocomplete="off">
    <!--<ul><li repeat.for="error of controller.errors">${error.message}</li></ul>-->

    <div class="form-group">
      <label class="control-label" for="A">String A</label>
        <input type="text" class="form-control" id="A" value.bind="A & validate">

jsobell

zXDcv<template>
  <form submit.delegate="submit()" novalidate autocomplete="off">
    <!--<ul><li repeat.for="error of controller.errors">${error.message}</li></ul>-->

    <div class="form-group">
      <label class="control-label" for="password">Password</label>
      <input type="password" class="form-control" id="password" placeholder="Password"
             value.bind="password & validate"
      >
    </div>

jsobell

<template>
  
  <require from="hc-ui-tabcontrol"></require>
  
  <button click.trigger='tc.handleClickEvent("TEST")'>TEST</button>
  <button click.trigger='showTC()'>showTC</button>
  
  <ui-tabcontrol controller.ref='tc'>
    <tab-page>
      <tab-heading>Heading1</tab-heading>