Использование $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 не работает.
Есть мысли?
3 ответов:
эта строка:
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
Comments