title: AngularJS show 2 decimal point number in number input field
body: <p>I have an issue with displaying form data fields to 2 decimal places. I set the variable <code>$Scope.theItem.Charge</code> to 2 decimal places:</p>
  
  <pre><code>$scope.theItem.charge = parseFloat(10 * 2).toFixed(2);
  </code></pre>
  
  <p>I then display this data in an editable form field like this:</p>
  
  <pre><code>&lt;input type="text" name="charge" id="charge" ng-model="theItem.charge"&gt;
  </code></pre>
  
  <p>This works correctly and displays the result, which in this case is <code>20.00</code>.
  However, because we are saying that this is an input type of "text" the user is able to enter any text into the field, not just numbers. I’d expect to simply do this:</p>
  
  <pre><code>&lt;input type="number" name="charge" id="charge" ng-model="theItem.charge" step="0.01"&gt;
  </code></pre>
  
  <p>But that returns the following error:</p>
  
  <blockquote>
    <p>angular.min.js:119 Error: [ngModel:numfmt]<br>
    <a href="http://errors.angularjs.org/1.5.9/ngModel/numfmt?p0=25.00" rel="nofollow noreferrer">http://errors.angularjs.org/1.5.9/ngModel/numfmt?p0=25.00</a><br>
    at angular.min.js:6<br>
    at Array. (angular.min.js:182)<br>
    at angular.min.js:293<br>
    at m.$digest (angular.min.js:144)<br>
    at m.$apply (angular.min.js:147)<br>
    at l (angular.min.js:98)<br>
    at D (angular.min.js:103)<br>
    at XMLHttpRequest.w.onload (angular.min.js:104)</p>
  </blockquote>
  
  <p>Does anyone have any ideas on how to resolve this? I’ve tried to use the angular directive as described in the link above but that does not work for my scenario.</p>