AngularJS : 컨트롤러에서 입력을 $ valid로 수동으로 설정하는 방법은 무엇입니까?
은 Using TokenInput의 플러그인 및 내장 FormController에 확인 AngularJS와를 사용하여.
지금은 필드에 텍스트가 포함되어 있는지 확인하고있는 경우 필드를 유효한 것으로 설정하려고합니다. 플러그인 사용의 문제는 자체 입력을 생성 한 다음 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 함수를 실행하고 있습니다.
편집하다:
내 입력에서 ng-model이 작동하고 자동 완성 결과를 얻습니다. 그래서 모델을 기반으로하므로 ng-valid가 작동하지 않습니다.
$scope.inventoryCapabilitiesAutoComplete = {
options: {
tokenLimit: null
},
source: urlHelper.getAutoComplete('capability')
};
이 자동 완성 구현을 작성하지 않았습니다. ng-model 속성에 액세스하고 모델 함수를 다른 곳으로 옮길 수있는 또 다른 방법이 있습니까?
양식의 유효성을 직접 변경할 수 없습니다. 모든 하위 입력이 유효하면 양식이 유효하고 유효하지 않으면 유효하지 않습니다.
해야 할 일은 입력 요소의 유효성을 설정하는 것입니다. 그렇게;
addItem.capabilities.$setValidity("youAreFat", false);
이제 입력 (및 양식)이 유효하지 않습니다. 또한 어떤 오류가 무효화를 일으키는지도 확인할 수 있습니다.
addItem.capabilities.errors.youAreFat == true;
위의 답변은 내 문제를 해결하는 데 도움이되지 않았습니다. 긴 검색 끝에 나는이 부분적인 해결책에 부딪혔다 .
마침내 입력 필드를 ng-invalid로 수동으로 설정하는이 코드로 문제를 해결했습니다 (ng-valid로 설정하려면 'true'로 설정).
$scope.myForm.inputName.$setValidity('required', false);
I came across this post w/a similar issue. My fix was to add a hidden field to hold my invalid state for me.
<input type="hidden" ng-model="vm.application.isValid" required="" />
In my case I had a nullable bool which a person had to select one of two different buttons. if they answer yes, an entity is added to the collection and the state of the button changes. Until all of the questions get answered, (one of the buttons in each of the pairs has a click) the form is not valid.
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>
It is very simple. For example : in you JS controller use this:
$scope.inputngmodel.$valid = false;
or
$scope.inputngmodel.$invalid = true;
or
$scope.formname.inputngmodel.$valid = false;
or
$scope.formname.inputngmodel.$invalid = true;
All works for me for different requirement. Hit up if this solve your problem.
'Programing' 카테고리의 다른 글
여러 줄 문자열 리터럴의 구문은 무엇입니까? (0) | 2020.09.07 |
---|---|
Eclipse에서 Tomcat 8.5.x 및 TomEE 7.x를 사용하는 방법은 무엇입니까? (0) | 2020.09.07 |
기계 학습이란 무엇입니까? (0) | 2020.09.07 |
Visual Studio HTML Designer는 어디에 있습니까? (0) | 2020.09.07 |
진행 상황을 제외하고 어떻게 명령 줄에서 robocopy를 무음으로 만들 수 있습니까? (0) | 2020.09.07 |