title: Why is my html file unable to find the UpdateSites method(Uncaught ReferenceError: UpdateSites is not defined)?
body: <p>I have set-up a simple drop-down menu this way:</p>
  
  <blockquote>
    <p>table.component.html</p>
  </blockquote>
  
  <pre><code>      &lt;select class="form-control" onchange="UpdateSites(this.value)"&gt;
    &lt;!-- //  console.log('FormControlChangeTest' + this.value)"&gt; --&gt;
        &lt;option&gt;France - Paris (Majunga)&lt;/option&gt;
        &lt;option&gt;France - Paris (Opus)&lt;/option&gt;  
  &lt;/select&gt;
  </code></pre>
  
  <blockquote>
    <p>table.component.ts</p>
  </blockquote>
  
  <pre><code>export class TableComponent {
   private UpdateSites(siteName){
      console.log('SITE NAME IS'+ siteName)
    }  
  </code></pre>
  
  <p>In the chrome console, I have this error:</p>
  
  <blockquote>
    <p>table:35 Uncaught ReferenceError: UpdateSites is not defined
        at HTMLSelectElement.onchange (table:35)    </p>
  </blockquote>
  
  <p>I would like to know what am I doing wrong exactly. i.e: Why isn't the html file finding the UpdateSites method.<br>
  PS: Out of curiosity I placed the UpdateSites outside of the class component but in the same file. However this still didn't work.</p>