title: Dropdown option value property binding to formControlName results in modified type
body: <p>I have a select element with options in component.html file as:</p>
  
  <pre><code>&lt;select name="balanceRounding" id="generalBalanceRounding" class="form-control" formControlName="balanceRounding"&gt;
      &lt;option *ngFor="let balRounding of balRoundings 
          [value]="balanceRounding.value"&gt;{{balRounding.text}}
      &lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>and in component.ts file, I have:</p>
  
  <pre><code>balRoundings = [
          { text: 'No Rounding', value: null },
          { text: '0.01', value: 0.01 },
          { text: '0.02', value: 0.02 },
          { text: '0.05', value: 0.05 },
          { text: '0.10', value: 0.10 },
          { text: '0.20', value: 0.20 },
          { text: '0.50', value: 0.50 },
          { text: '1.00', value: 1.00 }
  ];
  </code></pre>
  
  <p>Now, when I select any value from the dropdown, I am getting selected value as string in balanceRounding (formControlName).</p>
  
  <p>i.e. If I select 0.05, then I have balanceRounding as '0.05'</p>
  
  <p>If I select 'No Rounding', then I have balanceRounding as 'null'</p>
  
  <p>I just don't understand why my values are getting converted to a string.</p>
  
  <p>Could anyone suggest me how to have values of having type as it is?</p>
  
  <p>Thanks in advance.</p>