Patrick Patrick - 5 months ago 25
AngularJS Question

Input type number in AngularJS

I have a input type number in AngularJS as follows...

<input type="number"></input>


I want to achieve the following:


  • If user enters a positive value, it should display the same font and color

  • If the user displays a negative value, it should display font color in red indicating it is a negative number



Can someone please let me know how to achieve this dynamically?

Answer

You could do this.

HTML

<input type="number" ng-class="{negative: amount < 0, positive: amount > 0}" ng-model="amount"/>

CSS

.negative {
   color: red;
}
.positive {
    color: green;
}
Comments