Project

General

Profile

Actions

Padrão #55

open

Diretiva de input com duas casas decimais

Added by camila oliveira 5 months ago. Updated 5 months ago.

Status:
concluído
Priority:
normal
Category:
-
Start date:
07/24/2025
Due date:
% Done:

100%

Estimated time:

Description

Antes só havia o modelo de inputs numéricos com uma casa decimal... Como vi a necessidade em alguns exames, hoje fiz uma diretiva que contemplasse esse estilo, colocando aqui só para deixar registrado, agora poderemos usar 🙌🏼 pretendo voltar nas alternativas que deveriam ter duas casas decimais e corrigir isso!!

.directive('inputPadraoDuasCasas', function () {
return {
restrict: 'A',
require: 'ngModel',
link: function (scope, element, attrs, ngModelCtrl) {

    const formatar = (valor) => {
      if (!valor) return '';
      // Remove tudo que não for número ou vírgula/ponto
      let clean = valor.toString().replace(/[^0-9.,]/g, '');

      // Troca vírgula por ponto
      clean = clean.replace(',', '.');

      // Se houver mais de um ponto, remove os extras
      const parts = clean.split('.');
      if (parts.length > 2) {
        clean = parts[0] + '.' + parts.slice(1).join('');
      }

      const float = parseFloat(clean);
      return isNaN(float) ? '' : float.toFixed(2).replace('.', ',');
    };

    // Parser: transforma input em número
    ngModelCtrl.$parsers.push(function (valor) {
      const val = (valor || '').toString().replace(',', '.');
      const float = parseFloat(val);
      return isNaN(float) ? null : float;
    });

    // Formatter: formata o valor no input
    ngModelCtrl.$formatters.push(function (valor) {
      return formatar(valor);
    });

    // Formata no blur (quando o usuário sai do input)
    element.on('blur', function () {
      const val = formatar(element.val());
      element.val(val);
    });

    // Força seleção total mesmo em clique simples
    element.on('mousedown', function (e) {
        if (!element[0].contains(document.activeElement)) {
        e.preventDefault(); // impede o foco padrão
        setTimeout(() => {
            element[0].focus();
            element[0].select();
        }, 0);
        }
    });
  }
};

})


Files

Actions #1

Updated by Henrique Novaes 5 months ago

  • Status changed from teste to concluído
Actions

Also available in: Atom PDF