首页 > 其他 > 详细

angular限制输入框整数和小数的指令

时间:2019-02-21 10:04:27      阅读:189      评论:0      收藏:0      [点我收藏+]
(function () {
    ‘use strict‘;
    angular.module(‘common‘)
        .directive(‘numFormat‘, function () {
            return {
                restrict: ‘A‘,
                require: ‘ngModel‘,
                scope: {
                    isInt: ‘@‘,
                    decimal: ‘@‘,
                },
                controller: [‘$scope‘, function ($scope) {
                }],
                link: function (scope, $element, $attr, ngModelCtrl) {
                    function format() {
                        if (ngModelCtrl.$modelValue === null) {
                            ngModelCtrl.$setViewValue(null);
                            ngModelCtrl.$render();
                        } else if ( isNaN(ngModelCtrl.$modelValue) || ngModelCtrl.$modelValue === undefined) {
                            ngModelCtrl.$setViewValue(null);
                            $element.val(null);
                            ngModelCtrl.$render();
                        } else {
                            if (scope.isInt === ‘true‘) {
                                var f = Math.round(ngModelCtrl.$modelValue * 100) / 100;
                                var s = f.toString();
                                ngModelCtrl.$setViewValue(parseInt(s));
                                ngModelCtrl.$render();
                            } else if (scope.decimal) {
                                // 保留任意位小数
                                var s = ngModelCtrl.$modelValue.toString();
                                // var s = viewValue.length > modelValue.length ? viewValue:modelValue;
                                var rs = s.split(‘.‘);
                                if (rs.length > 1) {
                                    if (rs[1].length > parseInt(scope.decimal)) {
                                        rs[1] = rs[1].slice(0, scope.decimal)
                                        ngModelCtrl.$setViewValue(parseFloat(rs.join(‘.‘)));
                                    }

                                    var viewValue = ngModelCtrl.$viewValue.toString();
                                    viewValue = viewValue.split(‘.‘)
                                    if (viewValue[1].length > parseInt(scope.decimal)) {
                                        viewValue[1] = viewValue[1].slice(0, scope.decimal)
                                        ngModelCtrl.$setViewValue(parseFloat(viewValue.join(‘.‘)));
                                    }
                                }
                                ngModelCtrl.$render();
                            } else {
                                // 最多保留两位小数
                                var f = Math.round(ngModelCtrl.$modelValue * 100) / 100;
                                console.log(‘numform:‘,f)
                                var s = f.toString();
                                var rs = s.indexOf(‘.‘);
                                if (rs >= 0) {
                                    console.log(‘numform1:‘,s)
                                    ngModelCtrl.$setViewValue(parseFloat(s));
                                    ngModelCtrl.$render();
                                } else {
                                    // ngModelCtrl.$setViewValue(parseInt(s));
                                }
                            }
                        }
                    }

                    $element.keyup(format)
                }
            }
        })
})();

使用:

                <input min="0"  step="0.01" type="number" num-format class="form-control"  ng-model="money">

 

angular限制输入框整数和小数的指令

原文:https://www.cnblogs.com/kaibo520/p/10410518.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!