Angular 常用指令实例总结整理(2)

angular.module('my.directives').directive("resetToEmptyString", ["$parse", function ($parse) { return function (scope, element, attrs) { var dereg = scope.$watch(attrs.resetToEmptyString, function (newValue) { if (newValue) { if (attrs.ngModel) { var _getter = $parse(attrs.ngModel); if (_getter(scope)) { _getter.assign(scope, ""); } else { _getter.assign(scope.$parent, ""); } } } }); element.bind("$destroy", function () { if (dereg) { dereg(); } }); }; }]);

10. numberOnly 输入框内容仅限数值的指令(输入内容不允许为 负值),可以设定最大值(max属性)

angular.module('my.directives').directive("numberOnly", ["$parse", function ($parse) { return function (scope, element, attrs) { element.bind("keyup", function () { if(event.keyCode==37||event.keyCode== 39){ return false; } var val = element.val().replace(/[^\d.]/g, ''); if(attrs.max){ if(val>parseInt(attrs.max)){ val=attrs.max; } } element.val(val); if (attrs.ngModel) { $parse(attrs.ngModel).assign(scope, val); } return false; }); element.bind("afterpaste", function () { var val = element.val().replace(/[^\d.]/g, ''); if(attrs.max){ if(val>parseInt(attrs.max)){ val=attrs.max; } } element.val(val); if (attrs.ngModel) { $parse(attrs.ngModel).assign(scope, val); } return false; }); }; }]);

11. upperCaseOnly 输入框自动转换成大写

angular.module('my.directives').directive("upperCaseOnly", ["$parse", function ($parse) { return function (scope, element, attrs) { element.bind("keyup", function () { var val = element.val().toUpperCase(); element.val(val); if (attrs.ngModel) { $parse(attrs.ngModel).assign(scope, val); } return false; }); element.bind("afterpaste", function () { var val =element.val().toUpperCase(); element.val(val); if (attrs.ngModel) { $parse(attrs.ngModel).assign(scope, val); } return false; }); }; }]);

12. noSpecialString 输入框内容不能为特殊字符

angular.module('my.directives').directive("noSpecialString", ["$parse", function ($parse) { return function (scope, element, attrs) { element.bind("keyup", function () { var val = element.val().replace(/[\W]/g, ''); element.val(val); if (attrs.ngModel) { $parse(attrs.ngModel).assign(scope, val); } return false; }); element.bind("afterpaste", function () { var val = element.val().replace(/[^\d]/g, ''); element.val(val); if (attrs.ngModel) { $parse(attrs.ngModel).assign(scope, val); } return false; }); }; }]);

13. round2bit 输入框失去焦点 保留两位小数

angular.module('my.directives').directive("round2bit", ['$parse', '$filter', function ($parse, $filter) { return function ($scope, element, attrs) { element.blur(function () { if (attrs.ngModel) { var _getter = $parse(attrs.ngModel); var _numberStr2Round = (_getter($scope) || 0); _getter.assign($scope, $filter('number')(_numberStr2Round, 2).split(",").join("")); $scope.$apply(); } }); }; }]);

14.SelfHeight dom编译期设置元素高度,可以接受数字或者表达式

angular.module('hr.directives').directive('SelfHeight', ['$timeout', function ($timeout) { function _resizeElement(element, SelfHeight) { element.height((typeof SelfHeight === "number") ? SelfHeight : eval(SelfHeight)); }; return { priority: 1000, link: function (scope, element, attrs) { var hrSelfHeight = attrs["SelfHeight"]; var on = attrs["on"]; if (on) { $(window).resize(function () { _resizeElement(element, scope.$eval(SelfHeight)); }); scope.$watch(on, function () { $timeout(function () { _resizeElement(element, scope.$eval(SelfHeight)); }, 100); }, true); } else { $(window).resize(function () { _resizeElement(element, SelfHeight); }); _resizeElement(element, SelfHeight); } } }; }]);

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wwfjjw.html