angular directive does not work with input type = "number"

Question

The code below works only when the input type is text, and it doesn't work when the type is number.

<div ng-app="myApp" ng-controller="myCtrl as model">
 <input type="text"  ng-model="cero" ng-decimal   >   
</div> 


angular
    .module("myApp",[])
    .controller('myCtrl', function($scope){
        var model=this;
    })
    .directive('ngDecimal', function ($parse) {
        var linkFunction =function(scope, element, attrs){     
            element.bind("keypress", function(event) {
                if(event.which === 13) {    
                    scope.$apply(function(){
                        scope.$eval(attrs.format, {'event': event});
                        if(scope.cero===undefined || scope.cero===''){
                            scope.cero="0.", 
                            event.preventDefault();
                        }else{

                        }
                    });
                }
            });
        };
        return{
            restrict : 'A',
            scope:{
                cero: '=ngModel'
            },
            link: linkFunction
        }
    });

What I need help with is changing the type to number and still making the code work. The code is also on CodePen.

What you are trying to do with the directive. Can you elaborate your question? — Gangadhar Jannu
– Gangadhar Jannu, Commented Oct 4, 2016 at 14:51
@GangadharJannu well my question is: how I can make that directive to work me to change the input of text to number — FERNANDO ORTIZ
– FERNANDO ORTIZ, Commented Oct 4, 2016 at 14:52

Aks1357 · Accepted Answer · 2016-10-04 15:00:00Z

1

Updated pen : http://codepen.io/anon/pen/QKOVkP?editors=1011

Works with number, constraint being you cannot assign

scope.cero = "0." // string value

to a type="number" so replace it with the minimum number you want to assign, maybe

scope.cero = parseFloat("0.01")  // parseFloat("0.") won't work

answered Oct 4, 2016 at 15:00

Aks1357

1,0721 gold badge9 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

FERNANDO ORTIZ Over a year ago

yes perfect, But the condition, so I did not eliminate what the user has written but that no longer works, you know that?

Aks1357 Over a year ago

updated plunker with alert() , working both ways, also check the if condition scope.cero === null has been added to the conditions - codepen.io/anon/pen/QKOVkP?editors=1011

Beslinda N. · Accepted Answer · 2016-10-04 14:55:38Z

1

In the else condition add this.

scope.cero = parseFloat(scope.cero).toFixed(2);

Convert string to decimal

Here is the code: working code

answered Oct 4, 2016 at 14:55

Beslinda N.

5,3665 gold badges30 silver badges33 bronze badges

1 Comment

FERNANDO ORTIZ Over a year ago

thanks for this code, but if i change the input to type number dont work codepen.io/fernandooj/pen/amVaQm?editors=1011

Collectives™ on Stack Overflow

angular directive does not work with input type = "number"

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related