title: How do you pass input value into a function on form submit in Angular 6?
body: <p>So my code works when I hit enter (it runs the <code>performSearch</code> function successfully), but when I try to run the function by hitting my submit button I get the error:</p>
  
  <blockquote>
    <p>cannot read property error of undefined</p>
  </blockquote>
  
  <p><strong>Here's my code:</strong></p>
  
  <pre><code>&lt;mat-form-field (ngSubmit)='performSearch($event)' color='primary' id='search-input' class='full-width' appearance='outline'&gt;
      &lt;mat-label color='red'&gt;Search&lt;/mat-label&gt;
      &lt;input #searchBar matInput  [(ngModel)]='searchValue' name='searchBar' [value]='searchValue' (keyup.enter)='performSearch($event)'&gt;
   &lt;/mat-form-field&gt;
  
   &lt;button mat-raised-button color="primary" (click)='performSearch(searchBar.value)' id='submit-search' type='submit' for='searchBar'&gt;Submit&lt;/button&gt;
  </code></pre>
  
  <p>All I want is a way to grab the <code>#searchBar</code>' value and pass it into the <code>performSearch()</code> function that fires when I click the button. How do I do that?</p>