2016-11-10 24 views
0

私はCordova Ionic Appを作成しました。私は以下のコードを試しました。このディレクティブはAndroidではうまく動作しませんが、Androidでは動作しません。ユーザーが特殊文字を入力できるようにしています。誰も私がこれを解決する方法を教えてください。Ionic Androidでの携帯電話番号の確認

Register.html

    <label class="item item-input"> <span><i 
          class="icon ion-ios-telephone-outline"></i></span> <input type="number" 
         ng-pattern="/^[0-9]{10,10}$/" placeholder="Mobile" only-num 
         ng-model="register.mobile_number" name="mobile" ng-minlength="10" 
         ng-maxlength="10" required> 
        </label> 

app.js

  app.directive('onlyNum', function() { 
       return function(scope, element, attrs) { 

        var keyCode = [8,9,37,39,48,49,50,51,52,53,54,55,56,57,96,97,98,99,100,101,102,103,104,105,110]; 
        element.bind("keydown", function(event) { 
         console.log($.inArray(event.which,keyCode)); 
         if($.inArray(event.which,keyCode) == -1) { 
          scope.$apply(function(){ 
           scope.$eval(attrs.onlyNum); 
           event.preventDefault(); 
          }); 
          event.preventDefault(); 
         } 

        }); 
       }; 
      }); 

私もディレクティブの下に試してみました:

Register.html

    <label class="item item-input"> <span><i 
          class="icon ion-ios-telephone-outline"></i></span> <input type="number" 
         ng-pattern="/^[0-9]{10,10}$/" placeholder="Mobile" allow-pattern="\d" 
         ng-model="register.mobile_number" name="mobile" ng-minlength="10" 
         ng-maxlength="10" required> 
        </label> 

app.js

app.directive('allowPattern', [allowPatternDirective]); 

      function allowPatternDirective() { 
       return { 
        restrict: "A", 
        compile: function(tElement, tAttrs) { 
         return function(scope, element, attrs) { 
          // I handle key events 
          element.bind("keypress", function(event) { 
           var keyCode = event.which || event.keyCode; // I safely get the keyCode pressed from the event. 
           var keyCodeChar = String.fromCharCode(keyCode); // I determine the char from the keyCode. 

           // If the keyCode char does not match the allowed Regex Pattern, then don't allow the input into the field. 
           if (!keyCodeChar.match(new RegExp(attrs.allowPattern, "i"))) { 
            event.preventDefault(); 
            return false; 
           } 

          }); 
         }; 
        } 
       }; 
      }; 

答えて

0

それは数字

app.directive('numbersOnly', function() { 

    return { 
     restrict: 'A', 
     require: '?ngModel', 
     link: function (scope, element, attrs, modelCtrl) { 
      modelCtrl.$parsers.push(function (inputValue) { 
       if (inputValue == undefined) 
        return ''; 
       var transformedInput = inputValue.replace(/[^0-9]/g, ''); 
       if (transformedInput !== inputValue) { 
        modelCtrl.$setViewValue(transformedInput); 
        modelCtrl.$render(); 
       } 
       return transformedInput; 
      }); 
     } 
    }; 
}) 

とあなたの入力にこのディレクティブを含めてくださいだけでは

<input type="text" numbers-only> 

これを提出できるようになります。このディレクティブを使用してください私のためにうまくいく

+0

Androidでもうまくいきましたか? –

+0

私の場合は動作しません...他の解決策を教えてください... –

+0

入力フィールドに数字だけを入力してください。 –

関連する問題