import { Component , EventEmitter , Output } from '@angular/core' ; import { NgForm } from '@angular/forms' ; @ Component ( { selector : 'name-form' , template : `
    <form action="" class=""
      #nameForm="ngForm" (ngSubmit)="setUsername(nameForm)">
      <div class="ui action input">
        <input type="text" placeholder="username" name="username" #username="ngModel" required ngModel>
        <button class="ui button" type="submit" [disabled]="!nameForm.valid">set</button>
      </div>
    </form>
  ` } ) export class NameFormComponent { @ Output ( ) setName = new EventEmitter ( ) ; setUsername ( name ) { this . setName . emit ( name . value . username ) ; console . log ( name ) ; } }