title: Get value from selected dropdown list in Angular 2
body: <p>I have a database table with two attributes (Name_of_Game and Type_of_Game). I have been to extract the <strong>Name_of_Game</strong> into a select dropdown list. But this is what i want to do now. After selecting the game from the dropdown list, how can the <strong>type</strong> input be set to the game's respective type automatically? </p>
  
  <p><strong>Example</strong></p>
  
  <p>Game<br>
    Lord of the Rings</p>
  
  <p>Type</p>
  
  <p>Adventure </p>
  
  <p>After selecting Lord of the rings from the dropdown list, the type input box should be automatically set to Adventure.</p>
  
  <pre><code>    //Component 
  
      export class ChatComponent{
  
           Game : Games [];
           constructor(private http:HttpService){
  
           // list all games into the dropdown list
              this.http.listgames()
              .subscribe(data =&gt; {
  
                  this.Games = data;
      })
  
      }
  
     //html
  
              &lt;div class="form-group"&gt;
              &lt;select class="form-control" name="game"  [(ngModel)]="game.name" required&gt;
                  &lt;option *ngFor="let games of Games" [ngValue]="games" &gt; {{games.name}} &lt;/option&gt;
  
  
              &lt;/select&gt;
              &lt;/div&gt;
      &lt;div class="form-group"&gt;
                  &lt;label for="type"&gt;Type:&lt;/label&gt;
                  &lt;input type="type" class="form-control" name="type"   [(ngModel)]="game.type"&gt;
              &lt;/div&gt;
  </code></pre>