Angular2 - Attribute directive for a custom input component

Question

I have a component called <app-craftinput> . I'm using this on different layouts.

The template is: <input type="text" name="" value="" class="input__field input__field--type1">

What is the best method to add attributes like <app-craftinput [value]='23' [label]='Email'></app-craftinput> in the component's template?

Answer 1

Is this what you're looking for?

child .component.ts:

import { Input } from '@angular/core';

export class app {

@Input() value:number;

}

parent .component.html:

<app-craftinput [value]="3"></app-craftinput>

https://angular.io/docs/ts/latest/cookbook/component-communication.html

in order to utilize the information passed from the parent in your child element, in child .component.html:

<label for="{{value}}">{{value}}</label>