title: Angular 6 - getting input for a function
body: <p>I'm trying to get input from a text box and pass it to a function, I keep getting the error _co.randomCode is not a function. </p>
  
  <p>Only just started working with Angular and have tried a couple of different things but am stuck on this one.</p>
  
  <p>app.component.html</p>
  
  <pre><code>&lt;div class="form-group"&gt;
          &lt;input #randomCode class="form-control landing-code-input" placeholder="123456"&gt;
  &lt;/div&gt;
  &lt;button (click)="get_screen(randomCode.value)" class="btn btn-lg btn-assign-to-tap"&gt;Assign&lt;/button&gt;
  </code></pre>
  
  <p>app.component.ts</p>
  
  <pre><code>@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
  })
  export class AppComponent {
    private items : Item[] = [];
    title = 'site';
    randomCode = '';
  
    private itemsObservable : Observable&lt;Item[]&gt; ;
  
    constructor(private dataService: DataService) {
  
    this.dataService.get_screen(this.randomCode).subscribe((res : Item[])=&gt;{
      this.items = res;
       console.log(res);
    });
    }
  }
  </code></pre>
  
  <p>data.service.ts</p>
  
  <pre><code>export class DataService {
  
    apiUrl:string = "http://localhost/api/v1";
    constructor(private httpClient : HttpClient) {
  
     }
  
     get_screen(randomCode) {
       return this.httpClient.get(this.apiUrl + randomCode)
     }
  }
  </code></pre>