반응형
컨트롤러 내에서 $ setValidity 사용
파일 변경에 대한 유효성 검사를 시도하고 있습니다. 내 코드는 다음과 같습니다.
보기 / 템플릿
<input type="file" name="file" id="file"
onchange="angular.element(this).scope().setFile(this)"
required />
<span class="error" ng-show="myForm.file.$error.required">Error</span>
<span class="error" ng-show="myForm.file.$error.size">Selected file is too large</span>
<span class="error" ng-show="myForm.file.$error.filetype">Unsupported File type</span>
제어 장치
angular.module("myapp").controller("myctrl", function($scope) {
$scope.setFile = function(element) {
$scope.$apply(function($scope) {
var fileObject = element.files[0];
$scope.file.fileType =
fileObject.type.toUpperCase().substring(fileObject.type.indexOf("/") + 1);
// Validation
if (!$scope.isValidFileType($scope.file.fileType)) {
myForm.file.$setValidity("myForm.file.$error.filetype", false);
}
if (fileObject.size > 1000*1000*10) {
myForm.file.$setValidity("myForm.file.$error.size", false);
}
});
};
$scope.isValidFileType = function(fileExtension) {
var supportedExtensions = ["doc", "docx", "ppt", "pptx", "jpg", "gif", "png"]; // etc.
return (jQuery.inArray(fileExtension, supportedExtensions) > -1);
}
});
그러나 지금은 호출 $setValidity
이 작동하지 않습니다.
이견있는 사람?
이 줄 :
myForm.file.$setValidity("myForm.file.$error.size", false);
해야한다
$scope.myForm.file.$setValidity("size", false);
$ setValidity는 ngModelController에서 호출되어야합니다. 컨트롤러 내부에서는 $scope.myForm.file.$setValidity()
.
아직하지 않은 경우 양식 페이지 의 "사용자 지정 유효성 검사"섹션을 참조하십시오 .
또한 $ setValidity의 첫 번째 인수에는 'filetype'과 'size'만 사용하십시오.
단일 요소에 대해 여러 유효성 검사 메시지를 표시하는 더 좋고 최적화 된 솔루션은 다음과 같습니다.
<div ng-messages="myForm.file.$error" ng-show="myForm.file.$touched">
<span class="error" ng-message="required"> <your message> </span>
<span class="error" ng-message="size"> <your message> </span>
<span class="error" ng-message="filetype"> <your message> </span>
</div>
컨트롤러 코드는 @ Ben Lesh가 제안한 코드 여야합니다.
참고 URL : https://stackoverflow.com/questions/14363656/using-setvalidity-inside-a-controller
반응형
'Programing' 카테고리의 다른 글
Brew 설치 사용시 SHA1 오류 (0) | 2020.10.19 |
---|---|
IIS8 Win8 및 runAllManagedModulesForAllRequests =“true” (0) | 2020.10.19 |
팬더는 groupby로 합계하지만 특정 열은 제외합니다. (0) | 2020.10.19 |
console.log가 JavaScript 실행 성능을 저하 시키나요? (0) | 2020.10.19 |
Angular Karma Jasmine 오류 : 잘못된 상태 : 지시문에 대한 요약을로드 할 수 없습니다. (0) | 2020.10.19 |