javascript - AngularJS アプリケーションの読み込み時にすべてのフォームを検証する

Question

私のアプリケーションには、各リンクの横にそのページのフォームが有効かどうかを示す記号が表示された左側のナビゲーションがあります。ユーザーがページからページへとクリックすると、Angular はフォームを検証し、正しいシンボルが表示されます。ユーザーが各ページにアクセスして有効かどうかを確認するのではなく、ユーザーがアプリケーションに入るとすぐに検証記号を表示する必要があります。Angular の組み込みフォーム検証を利用しながら、各フォームを手動でトリガーして検証する方法はありますか? 私が思いついたアイデアの 1 つは、プログラムで各ページに移動して、各フォームを初期化および検証することでした。これまでのところ、AngularUI Router の $state.go を使用してもうまくいきませんでしたが、もう少しいじってみます。他のアイデアはありますか？ありがとう！

Answer 1

私の最初の解決策は、すべてのフォームの HTML を親ビューに挿入し、それらを非表示にして、アプリが読み込まれ、すぐに検証されるときに DOM にあるようにすることでした。これは機能しましたが、検証が有効から無効にちらつくという問題があり、DOM が大きいためにパフォーマンスに影響を与えました。

私がたどり着いたより良い解決策は、組み込みの Angular 検証を廃止し、独自の検証関数を作成することでした。検証関数は、ユーザーが入力を変更するとフィールドの有効性が更新されるように、最初のアプリの読み込み時にコントローラーで呼び出され、ディレクティブからも呼び出されます。このソリューションは、Angular のビルトイン バリデーションを使用してもあまり効果が得られないと確信した時点で、簡単に実装できました。