AngularJS vs JQuery input mask

1

I have ng-repeat and I need the input field to have the following format:

  

9,999.99

Code :

<tr ng-repeat="item in estado.tabela | orderBy:'ano'">
    <td>{{item.ano}}
    </td>
    <td>

       <input type="number"  step="any" ng-model="item.valor" class="form-control" ng-disabled="{{item.ano < @Model.Confo.ano}}">

    </td>
    <td>{{item.somatorio | number:2}}
    </td>

What is the best way to solve this?

    
asked by anonymous 15.04.2015 / 15:49

3 answers

1

I recommend using the Angular UI

Ex:

<input type="number"  step="any" ng-model="item.valor" class="form-control" ng-disabled="{{item.ano < @Model.Confo.ano}}" ui-mask="9.999,99">

link

    
16.04.2015 / 13:29
1

Use the jQuery Mask

Usage example

$("input[type=number]").mask("0.000,00");

link

    
15.04.2015 / 16:23
1

I'd advise doing something " manually " in javascript:

<html>
<head>
<script type="text/javascript">
  function mask(inputName, mask, evt) {
    try {
      var text = document.getElementById(inputName);
      var value = text.value;

      // If user pressed DEL or BACK SPACE, clean the value
      try {
        var e = (evt.which) ? evt.which : event.keyCode;
        if ( e == 46 || e == 8 ) {
          text.value = "";
          return;
        }
      } catch (e1) {}

      var literalPattern=/[0\*]/;
      var numberPattern=/[0-9]/;
      var newValue = "";

      for (var vId = 0, mId = 0 ; mId < mask.length ; ) {
        if (mId >= value.length)
          break;

        // Number expected but got a different value, store only the valid portion
        if (mask[mId] == '0' && value[vId].match(numberPattern) == null) {
          break;
        }

        // Found a literal
        while (mask[mId].match(literalPattern) == null) {
          if (value[vId] == mask[mId])
            break;

        newValue += mask[mId++];
      }

      newValue += value[vId++];
      mId++;
    }

    text.value = newValue;
  } catch(e) {}
}
</script>
</head>
<body>
<form id="form1">
<input type="text" id="zipCode" onkeyup="javascript:mask('zipCode', '0.000,00', event);" value= 9.999,99 >
</form>
</html>
    
16.04.2015 / 13:43