[解決済み] AngularJS:コントローラで入力に$validを手動で設定するにはどうすればよいですか?
2023-02-23 13:20:39
質問
この質問では トークン入力 プラグインを使用し、AngularJS 組み込みの formController バリデーションを使用します。
現在、私はフィールドにテキストが含まれているかどうかをチェックし、含まれている場合はフィールドを有効なものに設定しようとしています。プラグインを使用する際の問題は、それ自身の入力と、stlyingのためのul+liを作成することです。
私はコントローラでaddItem (formname)と私の能力にアクセスすることができ、私はちょうどそれを$validに設定する必要があります。
マークアップします。
<form class="form-horizontal add-inventory-item" name="addItem">
<input id="capabilities" name="capabilities" token-input data-ng-model="inventoryCapabilitiesAutoComplete" data-on-add="addCapability()" data-on-delete="removeCapability()" required>
<div class="required" data-ng-show="addItem.capabilities.$error.required" title="Please enter capability."></div>
</form>
JSです。
$scope.capabilityValidation = function (capability) {
if (capability.name !== "") {
addItem.capabilities.$valid = true;
addItem.capabilities.$error.required = false;
} else {
addItem.capabilities.$valid = false;
addItem.capabilities.$error.required = true;
}
};
TokenInputに何か入力されたときにcapabilityValidation関数を実行して、そのオブジェクトを渡しています。
EDITです。
入力のng-modelが何かをしてオートコンプリートの結果を取得することがわかりました、それはモデルに基づいているので、ng-validが動作しない理由です。
$scope.inventoryCapabilitiesAutoComplete = {
options: {
tokenLimit: null
},
source: urlHelper.getAutoComplete('capability')
};
このオートコンプリートの実装は私が書いたものではないので、ng-model attrにアクセスしてモデル関数をどこかに移動させるような他の方法はないでしょうか?
どのように解決するのですか?
フォームの有効性を直接変更することはできません。子孫の入力がすべて有効であれば、そのフォームは有効であり、そうでなければ無効となります。
すべきことは、input要素のvalidityを設定することです。このように
addItem.capabilities.$setValidity("youAreFat", false);
これで入力(つまりフォーム)は無効となりました。 また、どのエラーが無効の原因になっているかもわかります。
addItem.capabilities.errors.youAreFat == true;
関連
-
[解決済み] JavaScriptで文字列をbooleanに変換するにはどうしたらいいですか?
-
[解決済み] AngularJSでデータバインディングはどのように機能するのですか?
-
[解決済み] AngularJSを使用して、ブラウザのコンソールで$scope変数にアクセスするにはどうすればよいですか?
-
[解決済み] AngularJSで$scope.$watchと$scope.$applyを使用するにはどうすればよいですか?
-
[解決済み] Reduxの非同期フローになぜミドルウェアが必要なのか?
-
[解決済み] AngularJSのコントローラからビューにHTMLを挿入する
-
[解決済み] 入力フィールドにフォーカスを当てるには?
-
[解決済み] あるAngularJSのコントローラが別のコントローラを呼び出すことはできますか?
-
[解決済み] AngularJSでコントローラを2回実行する場合の対処法
-
[解決済み] JavaScriptでjson-objectのキーを取得する [重複].
最新
-
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 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Google maps API V3 - 同一地点に複数のマーカーを設置する。
-
[解決済み] javascriptで2つの数値を連結する方法は?
-
[解決済み] URL/アドレスバーからJavascriptの関数を呼び出す
-
[解決済み] JavaScriptで、ある文字列が別の文字列の中に出現するすべてのインデックスを見つけるにはどうすればよいですか?
-
[解決済み] オブジェクトの配列からReactコンポーネントをレンダリングする
-
[解決済み] AngularJS - ngRepeatフィルタリングされた結果の参照を取得する方法
-
[解決済み] jqueryはjavascriptのライブラリなのかフレームワークなのか?[クローズド]
-
[解決済み] 文字列とラベルのローカライズとグローバリゼーションのベストプラクティス【終了しました
-
[解決済み] Javascript の parseInt() で先頭のゼロを削除する。
-
[解決済み] Chrome拡張機能:popup.htmlを強制終了させる