AngularJS学習の道——フィルタ(2)

カスタムフィルタ

angular.module('filterApp',[])
.filter('myFilter',function(){
  return function(input){
    /* input          */
  }
})

フォーム検証
Input上のすべての検証項目:
1.必須項目
入力フィールド要素にHTML 5タグrequiredを追加すれば、フォーム入力が入力されているかどうかを確認します.

2.最小長さ
フォームに入力されたテキストの長さが最小値より大きいかどうかを確認し、入力フィールドでAngularJSコマンドng-minleng=「{number}」:

3.最大長さ
フォームに入力されたテキストの長さが最大値以下であることを確認し、入力フィールドでAngularJSコマンドng-maxlength=「{number}」:

4.パターンマッチング
ng-pattern="/PATERN/"を使用して、指定した正規表現に一致するように入力します.

5.電子メール
入力内容が電子メールであるかどうかを確認します.以下のようにinputのタイプをemailに設定すればいいです.

6.数値
入力内容が数値であることを確認し、inputのタイプをnumberに設定します.

7. URL
入力内容がURLであることを確認し、inputのタイプをurlに設定します.

8.フォームでの変数の制御
フォームのプロパティは、その属する$scopeオブジェクトにアクセスできます.$scopeオブジェクトにもアクセスできます.したがって、JavaScriptはDOMのフォームプロパティに間接的にアクセスできます.これらのプロパティを使用すると、フォームにリアルタイム(AngularJSの他のものと同じ)で応答できます.これらのプロパティには、次のものが含まれます.

変更されていないフォームこれは、ユーザーがフォームを変更したかどうかを判断するブール属性です.変更しない場合はtrue、変更した場合はfalse:formName.inputFieldName.$pristine

修正されたフォームは、ユーザーがフォームを修正する限り、入力が検証に合格するかどうかにかかわらず、true:formNameを返します.inputFieldName.$dirty

合法的なフォームこのブール型の属性は、フォームの内容が合法的かどうかを判断するために使用されます.現在のフォームの内容が正当である場合、次のプロパティの値はtrue:formName.です.inputFieldName.$valid

非合法なフォームこのブール属性は、フォームの内容が非合法であるかどうかを判断するために使用されます.現在のフォームの内容が不正である場合、次のプロパティの値はtrue:formName.inputFieldName.$invalid

エラーAngularJSが提供するもう一つの非常に有用なプロパティ:$errorオブジェクトです.現在のフォームのすべての検証内容と、それらが合法かどうかの情報が含まれています.このプロパティにアクセスするには、次の構文を使用します:formName.inputfieldName.$error

AngularJSはフォームを処理する時、フォームの現在の状態によっていくつかCSSクラスを追加します:.ng-pristine {} .ng-dirty {} .ng-valid {} .ng-invalid {}