newsletter.ts

@Component({
    selector: 'newsletter',
    template: `
      <fieldset class="newsletter">
          <legend>Bots Newsletter</legend>
          <h5>Hello {{firstName}}, if you like what you see - please enter your email below to subscribe:</h5>
          <form>
              <input #email type="email" name="email">
              <input  type="button" value="Subscribe"
                     (click)="subscribeToNewsletter(email)">
          </form>
      </fieldset>
    `
})
export class NewsletterComponent {

    @Input() firstName:string;
            
    @Output() subscribe = new EventEmitter();

    subscribeToNewsletter(emailField) {
        this.subscribe.emit(emailField.value);
        emailField.value = '';
    }
}