AngularJS を使用していくつかの検証を実装しようとしています。スコープ内のオブジェクトのリストにバインドされた入力のリストがあり、各入力の値がその前の入力の値以上であることを確認したい (数値のみを入力すると仮定しましょう入力)
これは、値が変更されたときに、次のことを確認する必要があることを意味します。
- 新しい値がまだ前の項目より大きいか等しい (リストの最初の項目でない場合)
- 後続のリスト項目 (存在する場合) が、新しく変更された値以上である
これを行う最善の方法はわかりませんが、可能な限り AngularJS 検証フレームワークを使用することをお勧めします。考えられる解決策は 3 つあります。
1: 検証を実行するカスタム ディレクティブを作成する
これを行う例を見つけましたが、ここで 2 つの質問があります。
-
現在検証されているスコープ プロパティに関連するスコープ プロパティにどのようにアクセスしますか?
- たとえば、インデックス 1 にバインドされた入力値が変更された場合、インデックス 1 の値を変更すると無効になる可能性があるため、インデックス 2 にバインドされた入力値を再評価するディレクティブをトリガーできますか? これまでのところ、ディレクティブ関数は、変更されたばかりのバインドに対してのみトリガーされることを見てきました。
2: UI 検証を使用する
この場合、リスト アイテムのインデックスを検証関数に渡すことができました。つまり、評価のために前のリスト項目の値にアクセスできるということです。しかし、変更されたばかりのアイテムに対してのみ発生するという問題がまだありました。リストの次のアイテムは再評価されませんでした。
3: バインドされた入力値ごとに onChange イベント ハンドラーを実装する
これにはjsFiddleがあります：
しかし、この場合、ハンドルを持っているのが基になるスコープ プロパティだけである場合、$setValidity 関数を呼び出す方法がわかりません。以下のコードは失敗します。
if (eval($scope.items[i].value) < eval($scope.items[i - 1].value)) {
$scope.items[i].$setValidity('notinorder', false);
}
AngularJS 検証フレームワークにまったく触れずに、この 2 番目の方法を使用して実装できると思いますが、それを使用する「正しい」方法があれば、知りたいです...