1. ホーム
  2. javascript

[解決済み] 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;