ng 防重复提交

深藏阁楼爱情的钟 2022-05-29 02:17 174阅读 0赞

# 转自：http://www.cnblogs.com/cynthia-wuqian/p/7019478.html #

#     #

# [angular ng-click防止重复提交][angular ng-click] #

方法一：点击后，让button的状态变为disable

js指令：

![复制代码][copycode.gif]

.directive('clickAndDisable', function() {
            return {
                scope: {
                    clickAndDisable: '&'
                },
                link: function(scope, iElement, iAttrs) {
                    iElement.bind('click', function() {
                        iElement.prop('disabled',true);
                        scope.clickAndDisable().finally(function() {
                            iElement.prop('disabled',false);
                        })
                    });
                }
            };
        })

![复制代码][copycode.gif]

html:

<button type="button" class="btn btn-info btn-bordered waves-effect w-md waves-light" click-and-disable="next()">下一步</button>   //把 ng-click 改为指令click-and-disable

方法二：在app.config里面，重写ng-click事件，设置一定事件内不能重复点击

![复制代码][copycode.gif]

$provide.decorator('ngClickDirective',['$delegate','$timeout', function ($delegate,$timeout) {  //记得在config里注入$provide
                var original = $delegate[0].compile;
                var delay = 500;//设置间隔时间
                $delegate[0].compile = function (element, attrs, transclude) {
    
                    var disabled = false;
                    function onClick(evt) {
                        if (disabled) {
                            evt.preventDefault();
                            evt.stopImmediatePropagation();
                        } else {
                            disabled = true;
                            $timeout(function () { disabled = false; }, delay, false);
                        }
                    }
                    //   scope.$on('$destroy', function () { iElement.off('click', onClick); });
                    element.on('click', onClick);
    
                    return original(element, attrs, transclude);
                };
                return $delegate;
            }]);

![复制代码][copycode.gif]

# [时间戳转化为时间格式 时间格式转为时间戳][Link 1] #

![复制代码][copycode.gif]

// 时间戳转化为时间
            Date.prototype.format = function(format) {
                var date = {
                    "M+": this.getMonth() + 1,
                    "d+": this.getDate(),
                    "h+": this.getHours(),
                    "m+": this.getMinutes(),
                    "s+": this.getSeconds(),
                    "q+": Math.floor((this.getMonth() + 3) / 3),
                    "S+": this.getMilliseconds()
                };
                if (/(y+)/i.test(format)) {
                    format = format.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length));
                }
                for (var k in date) {
                    if (new RegExp("(" + k + ")").test(format)) {
                        format = format.replace(RegExp.$1, RegExp.$1.length == 1
                            ? date[k] : ("00" + date[k]).substr(("" + date[k]).length));
                    }
                }
                return format;
            };

![复制代码][copycode.gif]

使用：

var effStartDate ="1494565993";//你的时间戳

var date= new Date();
    date.setTime(effStartDate);
    effStartDate = date.format('yyyy-MM-dd h:m:s'); //转化后的时间

时间转为时间戳：

var stringTime = "2017-06-16 12:21:12";
    var timestamp2 = Date.parse(new Date(stringTime));
    timestamp2 = timestamp2 / 1000; //如果前后端是按照毫秒为单位，那么不用除以1000
    console.log(timestamp2)；//转化后的时间戳

[angular ng-click]: http://www.cnblogs.com/cynthia-wuqian/p/7018531.html
[copycode.gif]: /images/20220529/96115d3b927c4e66bf54accff7bfc177.png
[Link 1]: http://www.cnblogs.com/cynthia-wuqian/p/7019478.html