How to use condition in expression in AngularJS -
i'm making small page show how number filter work:
number: <input type="text" ng-model="nomber"><br/> fractionsize: <input type="text" ng-model="fractionsize"><br/> gives: {{ nomber | number:fractionsize }}
if write number, work, if decide had nomber in fractionsize, remove it, gives me nan.
i have condition in
{{ nomber | number:fractionsize }}
that tell condition not try use fractionsize if input empty.
you should redefine filter using, cause design angular return nan, can see here: number filter should not format nan empty string
here custom filter accomplish looking for:
angular.module('plunker', []) .controller('mainctrl', function($scope) { $scope.nomber = 0; $scope.fractionsize = 0; }) .filter('textornumber', function ($filter) { return function (input, fractionsize) { if (isnan($filter('number')(input, fractionsize))) { return $filter('number')(input, 1); } else { return $filter('number')(input, fractionsize); }; }; });
<!doctype html> <html ng-app="plunker"> <head> <meta charset="utf-8" /> <title>angularjs plunker</title> <script data-require="angular.js@1.*" data-semver="1.4.0" src="https://code.angularjs.org/1.4.0/angular.js"></script> <script>document.write('<base href="' + document.location + '" />');</script> <link rel="stylesheet" href="style.css" /> <script src="app.js"></script> </head> <body ng-controller="mainctrl"> number: <input type="number" ng-model="nomber"><br/> fractionsize: <input type="number" ng-model="fractionsize"><br/> gives: {{ nomber | textornumber: fractionsize}} </body> </html>
edit: improvements can be, if consider , empty denominator in fraction can evaluated 1, can edit code returning $filter('number')(input, 1);
when isnan() has evaluated true.
here can find working plunkr.
Comments
Post a Comment