Get Value From Select Option in Angular 4

As a general (see Stackblitz here:


<select [(ngModel)]="selectedOption">
   <option *ngFor="let o of options">
<button (click)="print()">Click me</button>

<p>Selected option: {{ selectedOption }}</p>
<p>Button output: {{ printedOption }}</p>


export class AppComponent {
  selectedOption: string;
  printedOption: string;

  options = [
    { name: "option1", value: 1 },
    { name: "option2", value: 2 }
  print() {
    this.printedOption = this.selectedOption;

In your specific case you can use ngModel like this:

<form class="form-inline" (ngSubmit)="HelloCorp()">
     <div class="select">
         <select [(ngModel)]="corporationObj" class="form-control col-lg-8" #corporation required>
             <option *ngFor="let corporation of corporations"></option>    
         <button type="submit" class="btn btn-primary manage">Submit</button>

HelloCorp() {
  console.log("My input: ", corporationObj);

Leave a Comment