1 decimal formatted value in ngModel

Question

I have the following object:

dadosAnv = { horas_cel: 1950.0 }

It turns out that when I edit this value, it appears in the input only 1950. I’d like to keep the .0 value, but I have no idea how to format this value through a directive for example.

Answer 1

EDITED: As AP edit, I created a directive that formats the value as needed. I put two options, using the toFixed() of JavaScript or the $filter of Angular.

Use the filter number.

angular.module('myApp', [])
  .controller('myController', ['$scope',
    function($scope) {
      $scope.val = 1234.0;
    }
  ]);

angular.module('myApp')
  .directive('myDirective', function($filter) {
    return {
      require: 'ngModel',
      link: function(scope, element, attrs, ngModelController) {
        ngModelController.$formatters.push(function(data) {
          return $filter('number')(data, 2);
          //return Math.round(data).toFixed(2);
        });
      }
    }
  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myController">
  <label>Informe o número:
    <input type="text" ng-model='val' my-directive>
  </label>
  <br>Formatação padrão: <span id='number-default'>{{val | number}}</span>
  <br>Sem casas decimais: <span>{{val | number:0}}</span>
  <br>Com 2 casas decimais: <span>{{val | number:2}}</span>
</div>