atsu85

<template>
  Press enter in textbox to trigger event:
  <form submit.delegate="textEntered()">
    <input value.bind="message" />
  </form>
  ${message}
</template>

atsu85

<template>
  <require from="./on-key"></require>
  Press enter in textbox to trigger event:
  <input
    value.bind="message"
    keyup.delegate="textEntered() & onKey:'enter'"
  />
  ${message}
</template>

atsu85

<template>
  <require from="./relation-field.html"></require>
      <h1>${message}</h1>
      
      <!-- Fails on consecutive enhance -->
      <compose  repeat.for="relation of data.relations" view="./relation-field.html" view-model.bind="relation"></compose>
      
      <!--Will fail as well-->
      <!--<relation-field repeat.for="relation of data.relations" relation.bind="relation"></relation-field>-->

atsu85

var gulp = require('gulp');
var linter = require('gulp-aurelia-template-lint');
var config = new (require('aurelia-template-lint').Config);
var fail = require('gulp-fail');
var gulpIf = require('gulp-if');
var gutil = require('gulp-util');
var notify = require("gulp-notify");

var paths = require('../paths');

atsu85

export class Validator{
  constructor(){
    this.violatedConstraints = 10;
  }
}

atsu85

/** This file contains interfaces for lifecycle hooks that all HTML Behaviors (such as Views and Custom Elements) can use. */
declare module 'aurelia/lifecycle/html-behavior-hooks' {
    import {View} from "aurelia-framework";
    /** the first Html Behavior hook, that is called after the constructor */
    export interface Created {
        /**
         * If the view-model implements the created callback it is invoked next.
         * If your behavior is a custom element, it's view has also been created and both the view-model and the view are connected to their controller.
         * The created callback will receive the instance of the "owningView".
         * This is the view that the component is declared inside of.

atsu85

/** This file contains interfaces for Screen Activation Lifecycle hooks that Views can use. */
declare module 'aurelia/lifecycle/view-hooks' {
    import {Router, RouterConfiguration, RouteConfig, NavigationInstruction} from "aurelia-router";
    /**
     * A Navigation Command is any object with a navigate(router: Router) method.
     * When a navigation command is encountered, the current navigation will be cancelled and
     * control will be passed to the navigation command so it can determine the correct action.
     */
    export type NavigationCommand = {
        navigate(appRouter: Router): void

atsu85

<template>
  <p>How to get selected checkbox values to array?</p>
  <p>Follwoging <a href="http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/cheat-sheet/5" target="_blank">sample</a> isn't workign:</p>
  <label repeat.for="color of colors">
    <input type="checkbox" value.bind="color" checked.bind="$parent.favoriteColors" />
    ${color}
  </label>
  <p>PROBLEM: expecting array of selected values, not boolean: favoriteColors=${favoriteColors}</p>
</template>

atsu85

<template>
  <div repeat.for="person of persons">
    <span with.bind="person" element.ref="el">
      ${firstName} ${middleName} ${lastName}
    </span>
  </div>
  app.el = ${el} <-- this (global el) should be null
  <br/>
  person[0].el = ${persons[0].el} 
  <br/>

atsu85

<template>
  <h1>this video is being played twice if the autoplay attribute isn't bound to VM property. Pause and see</h1>
  <video src="http://video.webmfiles.org/big-buck-bunny_trailer.webm"
           ref="player" loop controls autoplay="${autoplay}"></video >
</template>