[解決済み] AngularJS <input> validation with no enclosing <form>
2022-12-18 19:37:38
Question
Is it possible in Angular to validate a single, isolated
<input>
in a similar way the forms are validated? I'm thinking about something like this:
<div class="form-group">
<input name="myInput" type="text" class="form-control" ng-model="bindTo" ng-maxlength="5">
<span class="error" ng-show="myInput.$error.maxlength">Too long!</span>
</div>
The example above doesn't work. Enclosing it in a
<form>
and replacing
ng-show
with
ng-show="myForm.myInput.$error.maxlength"
helps.
Is it possible to do this without using
<form>
?
How to solved?
You may use the ng-form angular directive ( see docs here ) を使って、HTML フォームの外でも何でもグループ化することができます。そして、angular FormController を利用することができます。
<div class="form-group" ng-form name="myForm">
<input name="myInput" type="text" class="form-control" ng-model="bindTo" ng-maxlength="5">
<span class="error" ng-show="myForm.myInput.$error.maxlength">Too long!</span>
</div>
関連
-
[解決済み] 名前が''の無効なフォームコントロールはフォーカスされない
-
[解決済み] ページロード時にAngularJSのコントローラ関数を実行する方法は?
-
[解決済み] AngularJSでデータバインディングはどのように機能するのですか?
-
[解決済み] AngularJSを使用して、ブラウザのコンソールで$scope変数にアクセスするにはどうすればよいですか?
-
[解決済み] AngularJSで$scope.$watchと$scope.$applyを使用するにはどうすればよいですか?
-
[解決済み] AngularJS コントローラにおける 'this' と $scope の比較
-
[解決済み] ng-classを使った複数クラスの追加
-
[解決済み】AngularJSのディレクティブスコープにおける「@」と「=」の違いは何ですか?
-
[解決済み】AngularJSのスコーププロトタイピング/プロトタイピング継承のニュアンスとは?
-
[解決済み] Angularjsで入力検証失敗時にフォームを送信しないようにする
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] `ui-router` $stateParams vs. $state.params
-
[解決済み] 方法 $state.go()
-
[解決済み] 適用がすでに進行中のエラー
-
[解決済み] data-ng-file-selectが動作しないのはなぜですか?
-
[解決済み] エラーです。10回の$digest()反復に達しました。動的なsortby述語で中断!?
-
[解決済み] AngularJS : ローカルストレージを使用する
-
[解決済み] AngularJSのリソースプロミス
-
[解決済み] AngularJS: ngRouteが動作しない。
-
[解決済み] AngularJs .$setPristineでフォームをリセットする
-
[解決済み] AngularJSの.$on()とは?