title: Active focus element display in HTML and Typescript
body: <p>Moving the selected element of the <code>&lt;select&gt;</code> dropdown menu list on the Top or Bottom of the list.</p>
  
  <p>I am able to get the focus element of the select using :</p>
  
  <p><code>this.element.nativeElement.focus();</code>
  . </p>
  
  <p>But not able to find out moving the selected value to the first or last position whenever scroll is possible in Typescript.</p>
  
  <p>Example :</p>
  
  <p><a href="https://i.stack.imgur.com/I0gYk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/I0gYk.png" alt="Select dropdown with names of countries"></a></p>
  
  <p>Focused element "California" moves to the first place, every time select field is clicked and the list scrolls.</p>