issue with ngPattern

Question

私は、入力中に有効期限の月と年の間に自動的に "/"を挿入する、クレジットカードのチェックアウトフォームに有効期限を入力するように設計しようとしています。 ngPattern検証を入力に導入したので、モデルは入力値を取得しません。 Angularでは、検証が成功した時点でモデルが入力値を取り上げることができます。これは基本的に私のコードのために私の気の利いた機能は動作しません。誰かがこれを回避する方法を見つけることができます。以下は私のコードです。

HTML

<input ng-keyup="checkout.updateExp()" class="form-control" type="text" maxlength="7" placeholder="mm/yy" required autocomplete="off" name="exp" ng-pattern="/\d{2}\s\/\s\d{2}/" ng-model="checkout.cf.exp"> 

コントローラ機能代わりNGパターンを使用してそれを行うことの正規表現を使用して手動で検証しない理由

vm.updateExp = function(){ 
    var separator="/"; 

    //add separator 
    if(vm.cf.exp.length==2){//-----> cannot process since ngPattern makes exp undefined till pattern is met 
     vm.cf.exp = vm.cf.exp.substring(0,2) + separator; 
    } 
    //remove separator 
    if(vm.cf.exp.length==4){ 
     vm.cf.exp = vm.cf.exp.substring(0,1);; 
    } 
}; 

Answer 1

？ ng-patternを使ってangleが行うのと同じように、フィールドの$ validityを手動で設定することができます。 HTMLで

は

ng-keyup="checkout.updateExp(form.exp)" name="exp" 

form.expを追加した形態と、入力フィールドの名前です。フォーム名が何であるかわからないので、それに応じて置き換える必要があります。

vm.updateExp = function(formModel){ 
    /* existing code omitted */ 
    var expression = /\d{2}\s\/\s\d{2}/; // create RegEx 
    formModel.$setValidity("pattern", expression.test(vm.cf.exp)); // set validity to whatever name you want, I used the name pattern 
};