angularjs+ionic 登録ページのフォーム検証

タブとルーティングが設定された登録ページhtml上:

機能:

• 2つのパスワード入力が正しいかどうかの判定。同じです。tabs.mypage ページに入る前に、チェックボックスをクリックして登録してください。

• 認証コードは実際には送信されず、バックグラウンドで認証コードのデータが取得され、入力された認証コードと比較されます。

使用:

• 4-- novalidate: 検証との競合を避けるために、<form> フォームのネイティブ検証を実行することは禁止されています。設定したメソッド

• 7-- type="number": 入力する数値のタイプを制限します。 required: 制限を空にすることはできません。 入力文字最小、最大長

• 11--

  type="password": セマンティック、パスワード形式ng-pattern="/[a-zA-Z0-9 ]/" : 通常のルールで数字または文字を入力します

• 20--

  ng-click="getTestCode()": バインドクリック イベント; ng-bind="description": コントロールボタン テキストを表示します。ng-disabled="canClick": 短期間に複数のリクエストが行われないようにボタンの可用性を制御します。

• 25--

  ng-show="": プロンプトテキストを表示します。条件に基づいて; registerForm .number: registerForm という名前の

  フォーム内の 入力ボックスがユーザーと対話しました。 $invalid: 入力ボックスの内容は、あなたが設定した検証に合格しませんでした。 33-- ng-disabled="registerForm.$invalid"

  ：フォームは使用する前に検証に合格する必要があります

• 注:

< ;label> は使用しないでください。ラベルにクリック イベントを追加してください。 ！

                                                                  手机号                                                                            输入密码                                                                            确认密码                                                                            验证码                                                                                                                   手机号输入有误             密码输入格式有误         两次密码输入不一致                                    同意发货么用户协议                           注册

ルートバインディング

の

コントローラー
js:

関数:

クリックして確認コードを取得

関数をトリガーします。59秒のカウントダウン中にリクエストを再度送信することはできません。 注:

コントローラーに$interval

 1     $scope.canClick=false; 2     $scope.description="获取验证码"; 3     var second=59; 4     var timerHandler; 5     $scope.getTestCode=function(){10         timerHandler=$interval(function(){11             if(second<=0){12             $interval.cancel(timerHandler);13             second=59;14             $scope.description="获取验证码";15             $scope.canClick=false;16         }else{17             $scope.description=second+"s后重发";18             second--;19             $scope.canClick=true;20         }21             },1000)22     };

を忘れずに注入してください

以上がangularjs+ionic 登録ページのフォーム検証の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。