javascript - Angular js directive doesn't work on page load -
i new angularjs below directive support decimal , commas, works fine when change made field how ever data in fields not validated when page loads
var app = angular.module('myapply.directives', [], function () { }); app.directive('numericdecimalinput', function($filter, $browser, $locale,$rootscope) { return { require: 'ngmodel', priority: 1, link: function($scope, $element, $attrs, ngmodelctrl) { var replaceregex = new regexp($locale.number_formats.group_sep, 'g'); var fraction = $attrs.fraction || 0; var listener = function() { var value = $element.val().replace(replaceregex, ''); $element.val($filter('number')(value, fraction)); }; var validator=function(viewvalue) { ngmodelctrl.$setvalidity('outofmax', true); ngmodelctrl.$setvalidity(ngmodelctrl.$name+'numeric', true); ngmodelctrl.$setvalidity('rangevalid', true); if(!_.isundefined(viewvalue)) { var newval = viewvalue.replace(replaceregex, ''); var newvalasnumber = newval * 1; // check if new value numeric, , set control validity if (isnan(newvalasnumber)) { ngmodelctrl.$setvalidity(ngmodelctrl.$name + 'numeric', false); } else { if (newval < 0) { ngmodelctrl.$setvalidity(ngmodelctrl.$name + 'numeric', false); } else { newval = newvalasnumber.tofixed(fraction); ngmodelctrl.$setvalidity(ngmodelctrl.$name + 'numeric', true); if (!(_.isnull($attrs.maxamt) || _.isundefined($attrs.maxamt))) { var maxamtvalue = number($attrs.maxamt) || number($scope.$eval($attrs.maxamt)); if (newval > maxamtvalue) { ngmodelctrl.$setvalidity('outofmax', false); } else { ngmodelctrl.$setvalidity('outofmax', true); } if(!(_.isnull($attrs.minamt) || _.isundefined($attrs.minamt))) { var minamtvalue = number($attrs.minamt)|| number($scope.$eval($attrs.minamt)); if((newval > maxamtvalue) || (newval < minamtvalue)){ ngmodelctrl.$setvalidity('rangevalid', false); } else { ngmodelctrl.$setvalidity('rangevalid', true); } } } else if((!(_.isnull($attrs.minamt) || _.isundefined($attrs.minamt)))) { var minamtvalue = number($attrs.minamt)|| number($scope.$eval($attrs.minamt)); if(newval < minamtvalue) { ngmodelctrl.$setvalidity('outofmin', false); } else { ngmodelctrl.$setvalidity('outofmin', true); } } else { ngmodelctrl.$setvalidity('outofmax', true); } } } return newval; } }; // runs when model gets updated on scope directly , keeps our view in sync ngmodelctrl.$render = function() { ngmodelctrl.$setvalidity('outofmax', true); ngmodelctrl.$setvalidity(ngmodelctrl.$name+'numeric', true); $element.val($filter('number')(ngmodelctrl.$viewvalue, fraction)); }; $element.bind('change', listener); $element.bind('keydown', function(event) { var key = event.keycode; // if keys include ctrl, shift, alt, or meta keys, home, end, or arrow keys, nothing. // lets support copy , paste if (key == 91 || (15 < key && key < 19) || (35 <= key && key <= 40)) return; }); $element.bind('paste cut', function() { $browser.defer(listener); }); ngmodelctrl.$parsers.push(validator); ngmodelctrl.$formatters.push(validator); } }; });
could 1 please let me know missing . thanking in advance.
have declared app
(doesn't show in code)? ie:
var app = angular.module('app', []);
do have ng-app
in html document anywhere?
<html lang="en-gb" ng-app="app">
check out documentation started modules (angular documented, worth reading): https://docs.angularjs.org/guide/module
Comments
Post a Comment