fixed formatting on init; fixed initial formatting without data in ng…

… model; made validating the angular way
mareczek · Apr 20, 2015 · 4184aaf · 4184aaf
1 parent 9c41abe
commit 4184aaf
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 29 deletions.
diff --git a/releases/international-phone-number.js b/releases/international-phone-number.js
@@ -1,6 +1,6 @@
 (function() {
   "use strict";
-  angular.module("internationalPhoneNumber", []).directive('internationalPhoneNumber', function() {
+  angular.module("internationalPhoneNumber", []).directive('internationalPhoneNumber', function($timeout) {
     return {
       restrict: 'A',
       require: '^ngModel',
@@ -61,27 +61,28 @@
           });
         });
         ctrl.$formatters.push(function(value) {
-          element.intlTelInput('setNumber', value);
-          return element.val;
+          if (!value) {
+            return value;
+          } else {
+            $timeout(function() {
+              return element.intlTelInput('setNumber', value);
+            }, 0);
+            return element.val();
+          }
         });
         ctrl.$parsers.push(function(value) {
           if (!value) {
             return value;
           }
           return value.replace(/[^\d]/g, '');
         });
-        ctrl.$parsers.push(function(value) {
-          var validity;
-          if (value) {
-            validity = element.intlTelInput("isValidNumber");
-            ctrl.$setValidity('international-phone-number', validity);
-            ctrl.$setValidity('', validity);
+        ctrl.$validators.internationalPhoneNumber = function(value) {
+          if (!value) {
+            return value;
           } else {
-            value = '';
-            delete ctrl.$error['international-phone-number'];
+            return element.intlTelInput("isValidNumber");
           }
-          return value;
-        });
+        };
         element.on('blur keyup change', function(event) {
           return scope.$apply(read);
         });

diff --git a/releases/international-phone-number.min.js b/releases/international-phone-number.min.js
diff --git a/src/international-phone-number.coffee b/src/international-phone-number.coffee
@@ -2,7 +2,7 @@
 # https://github.com/mareczek/international-phone-number
 
 "use strict"
-angular.module("internationalPhoneNumber", []).directive 'internationalPhoneNumber', () ->
+angular.module("internationalPhoneNumber", []).directive 'internationalPhoneNumber', ($timeout) ->
 
   restrict:   'A'
   require: '^ngModel'
@@ -50,37 +50,39 @@ angular.module("internationalPhoneNumber", []).directive 'internationalPhoneNumb
       # Wait to see if other scope variables were set at the same time
       scope.$$postDigest ->
         options.defaultCountry = scope.defaultCountry
-        
+
         if newValue != null and newValue != undefined and newValue != ''
           element.val newValue
-        
+
         element.intlTelInput(options)
 
         unless attrs.skipUtilScriptDownload != undefined || options.utilsScript
           element.intlTelInput('loadUtils', '/bower_components/intl-tel-input/lib/libphonenumber/build/utils.js')
-      
+
         watchOnce()
 
     )
 
 
     ctrl.$formatters.push (value) ->
-      element.intlTelInput 'setNumber', value
-      return element.val
+      if !value
+        return value
+      else
+        $timeout () ->
+          element.intlTelInput 'setNumber', value
+        , 0
+        return element.val()
 
     ctrl.$parsers.push (value) ->
       return value if !value
       value.replace(/[^\d]/g, '')
 
-    ctrl.$parsers.push (value) ->
-      if value
-        validity = element.intlTelInput("isValidNumber")
-        ctrl.$setValidity 'international-phone-number', validity
-        ctrl.$setValidity '', validity
+    ctrl.$validators.internationalPhoneNumber = (value) ->
+      if !value
+        return value
       else
-        value = ''
-        delete ctrl.$error['international-phone-number']
-      value
+        return element.intlTelInput("isValidNumber")
+
 
     element.on 'blur keyup change', (event) ->
       scope.$apply read