title: Add a conditional to ng keypress
body: <p>When a text input contains a specific value, I want to show a div.</p>
  
  <p>For my template I have:</p>
  
  <pre><code>&lt;input type="text" id="jobTitle" 
  (click)="autoCompleteClick()"
  (keypress)="autoCompleteKeypress()" name="autocomplete" 
  placeholder="Job Title" value="" &gt;
  </code></pre>
  
  <p>My thinking was the keypress would run the autoCompleteKeyPress function which looks like this:</p>
  
  <pre><code>autoCompleteKeypress() {
      if (this.jobTitle == 'bar' || this.jobTitle == 'Bar'){
          alert('BOO!');
      } 
  }
  </code></pre>
  
  <p>At the moment i'm just testing with with an alert to get it working.</p>
  
  <p>My full component is:</p>
  
  <pre><code>import { Component } from '@angular/core';
  import { Input } from '@angular/core';
  
  @Component({
      selector: 'sign-up',
      templateUrl: './sign-up.component.html',
      styleUrls: ['../variables.less', './sign-up.component.less']
  })
  
  export class SignUpComponent {
      imgPath = 'assets/images/';
      //acInput = document.getElementById('jobTitle');
  
      @Input() jobTitle : string;
  
  
      autoCompleteKeypress() {
          if (this.jobTitle == 'bar' || this.jobTitle == 'Bar'){
          alert('BOO!');
      } 
  }
  </code></pre>
  
  <p>Very new to Angular2 and Typescript in general so any ideas are appreciated. Thanks!</p>