Formatted value with 1 decimal place in ngModel

Question

Formatted value with 1 decimal place in ngModel

Navigation

#1 by (1 votes)

1

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 would like to keep .0 of the value, however I have no idea how to format this value through a directive for example.

angularjs

asked by anonymous 15.02.2016 / 20:45

1 answer

Published App for Windows Phone does not install on devices [closed] Controls do not Appear in Windows 10

score 1 · Accepted Answer

EDIT : As per AP edition, I created a directive that formats the value as required. I put two options, using toFixed() of JavaScript or $filter of Angular .

Use the number filter.

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><divng-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>