在控制器中使用 $setVality

我正在尝试对文件更改进行一些验证。以下是我的代码:

视图/模板

<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的电话没有用。
有什么想法吗？

126838 次浏览

小开

需要在 ngModelController 上调用 $setVality，在控制器内部，我认为这意味着 $scope.myForm.file.$setValidity()。

如果您还没有看到表格页上的“自定义验证”部分，请参阅。

此外，对于 $setVality 的第一个参数，只使用‘ filetype’和‘ size’。

小开

最佳答案

这句话:

myForm.file.$setValidity("myForm.file.$error.size", false);

应该是

$scope.myForm.file.$setValidity("size", false);

小开

对于单个元素显示多个验证消息的更好和优化的解决方案如下所示。

<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 建议的代码