Input TS

input-field.ts

import {
Component,
ChangeDetectionStrategy,
ChangeDetectorRef,
Input
} from 'angular2/core';
import {ROUTER_DIRECTIVES} from 'angular2/router';
import {APPLICATION_VALIDATORS} from './application-validators';
import {FocusOn} from './focus-on.directive.ts';
import {Control} from 'angular2/common';

@Component({
    selector: 'input-field',
    directives: [ROUTER_DIRECTIVES, APPLICATION_VALIDATORS, FocusOn],
    providers: [],
    template: require('./input-field.html'),
    changeDetection: ChangeDetectionStrategy.OnPush
})

export class InputField {
    @Input() details;
    @Input() focusOn;
    @Input() form;
    @Input() label;
    @Input() min = 0;
    @Input() max = 999999;
    @Input() model;
    @Input() pattern;
    @Input() required;
    @Input() type = 'text';
    @Input() var;
    myControl = new Control();
    constructor(
        public cdr: ChangeDetectorRef
    ) {
    }
    ngOnInit() {
        this.form.addControl(this.var, this.myControl);
    }
    ngAfterViewInit() {
        this.form.controls[this.var].updateValue(undefined);
        this.cdr.markForCheck();
    }
    ngAfterViewChecked() {
        if (this.model && (this.myControl.value === null || this.myControl.value === undefined)) {
            this.form.controls[this.var].updateValue(this.model);
            this.cdr.markForCheck();
        }
    }
    ngOnDestroy() {
        this.form.removeControl(this.var);
        this.form.updateValueAndValidity();
    }