/// <reference path="../../typings/angular2/angular2.d.ts" />
/// <reference path="../../typings/angular2/angular2_addons.d.ts" />
import {Component, View, bootstrap, Form, EventEmitter} from 'angular2/angular2';
import {FormBuilder, Validators, formDirectives, ControlGroup} from 'angular2/forms';
import {Inject} from 'angular2/di';

@Component({
  selector: 'mycmp',
  appInjector: [FormBuilder]
})
@View({
  template: '<form [ng-form-model]="myForm"><input type="text" ng-control="myText">{{myForm.controls.myText.value}}</form>',
  directives: [formDirectives],
})
export class MyCmp {
  myForm:ControlGroup;
  constructor(@Inject(FormBuilder) builder:FormBuilder) {
    this.myForm = builder.group({
        myText: ["someDefaultVal...", Validators.required]
    });

    this.myForm.controls.myText.valueChanges.subscribe(function (value) {
        console.log("changed value=" + value);
    }.bind(this));
  }
}

bootstrap(MyCmp);