Thanood

<template>
  <require from="./my-icon"></require>
  <require from="./my-list.html"></require>
  <require from="./my-list-item.html"></require>
  <div>
    <input type="text" value.bind="term" placeholder="filter" />
    <button click.delegate="addSome()">add some</button>
  </div>
  
  <!--<div>

Thanood

<template>
  <div>
    <md-file md-caption="upload file" view-model.ref="fileInput" md-label-value.bind="labelValue"></md-file>
    <div if.bind="selectedFile">
      selected file: ${selectedFile.name} (${selectedFile.size} bytes)
    </div>
  </div>
</template>

Thanood

<template>
  <div>
    <div style="border: solid 1px green;" repeat.for="item of topItems">${item}</div>
    <div style="border: solid 1px orange;" repeat.for="item of items">${item}</div>
    <div style="border: solid 1px blue;" repeat.for="item of bottomItems">${item}</div>
  </div>
</template>

Thanood

System.config({
  defaultJSExtensions: true,
  transpiler: "traceur",
  paths: {
    "*": "dist/*",
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
  },

  meta: {

Thanood

<template>
  <div>
    <label><input type="checkbox" checked.bind="useDirectEvent" />use fireEvent directly on selectSome</label>
  </div>
  <div>
    <select multiple value.bind="selectedValues" ref="sel">
      <option value="opt1">Option 1</option>
      <option value="opt2">Option 2</option>
      <option value="opt3">Option 3</option>
      <option value="opt4">Option 4</option>

Thanood

<template>
  <require from="./md-x-select"></require>
  <select md-x-select="disabled.bind: disabled" 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>
  

Thanood

// Use Gists to store code you would like to remember later on
console.log(window); // log the "window" object to the console

Thanood

<template>
  <require from="valueConverters"></require>
  <div class="row">
    <v-grid
      class="col-md-6"
      style="height:350px"
      v-row-height="25"
      v-current-entity.bind=myCurrentEntity
      v-collection.bind="myCollection| selected:'isSelected':showOnlySelected"
      v-grid-context.bind=myGrid>

Thanood

<template>
  <div>
    <md-card md-title="Card title">
      <div>
        I am a very simple card. I am good at containing small bits of
        information. I am convenient because I require little markup to
        use effectively.
      </div>
    </md-card>
  </div>

Thanood

import {inject} from 'aurelia-dependency-injection';
import {validationRenderer} from 'aurelia-validation';

@validationRenderer
@inject(Element)
export class BootstrapFormValidationRenderer {
  constructor(boundaryElement) {
    this.boundaryElement = boundaryElement;
  }