AngularJS:我如何在控制器中手动设置input为$ valid?
使用TokenInput插件并使用AngularJS内置的formControllervalidation。
现在我试图检查该字段是否包含文本,然后将字段设置为有效,如果是的话。 使用插件的问题是它创build了它自己的input,然后是一个ul +李的st </s>。
我有权访问addItem(formname)和我的能力在控制器中,我只需要将其设置为$有效。
标记。
<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函数。
编辑:
在我的input中发现ng-model会做些什么,并得到自动完成的结果,这就是为什么我不能使用ng-valid来工作,因为它是基于模型的。
$scope.inventoryCapabilitiesAutoComplete = { options: { tokenLimit: null }, source: urlHelper.getAutoComplete('capability') };
我没有写这个自动完成的实现,是否有另一种方式来做到这一点,我可以访问ng模型attr并将模型函数移动到别的地方?
您不能直接更改表单的有效性。 如果所有的后代input都是有效的,那么这个表格是有效的,如果不是,那么它就不是。
你应该做的是设置input元素的有效性。 像这样;
addItem.capabilities.$setValidity("youAreFat", false);
现在input(和表单)是无效的。 你也可以看到哪个错误导致失效。
addItem.capabilities.errors.youAreFat == true;
上面的答案没有帮助我解决我的问题。 经过漫长的search,我碰到了这个部分的解决scheme 。
我终于用这个代码解决了我的问题,手动将input字段设置为ng-invalid(设置为ng-valid将其设置为“true”):
$rootScope.myForm.inputName.$setValidity('required', false);
我碰到这个post有类似的问题。 我的修复是添加一个隐藏的字段来为我保持我的无效状态。
<input type="hidden" ng-model="vm.application.isValid" required="" />
在我的情况下,我有一个可空的布尔,一个人不得不select两个不同的button之一。 如果他们回答是,则将一个实体添加到该集合中,并且该button的状态改变。 在所有问题得到解答之前,(每一对中的一个button都有一个点击)表单无效。
vm.hasHighSchool = function (attended) { vm.application.hasHighSchool = attended; applicationSvc.addSchool(attended, 1, vm.application); }
<input type="hidden" ng-model="vm.application.hasHighSchool" required="" /> <div class="row"> <div class="col-lg-3"><label>Did You Attend High School?</label><label class="required" ng-hide="vm.application.hasHighSchool != undefined">*</label></div> <div class="col-lg-2"> <button value="Yes" title="Yes" ng-click="vm.hasHighSchool(true)" class="btn btn-default" ng-class="{'btn-success': vm.application.hasHighSchool == true}">Yes</button> <button value="No" title="No" ng-click="vm.hasHighSchool(false)" class="btn btn-default" ng-class="{'btn-success': vm.application.hasHighSchool == false}">No</button> </div> </div>