在Controller中使用$ setValidity
我正在尝试对文件更改做一些validation。 这是我的代码:
查看/模板
<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);
需要在ngModelController上调用$ setValidity。 在控制器内部,我认为这意味着$scope.myForm.file.$setValidity()
。
如果还没有,请参阅“ 表单”页面上的“自定义validation”部分。
另外,对于$ setValidity的第一个参数,只需使用'filetype'和'size'。
为单个元素显示多个validation消息的更好和优化的解决scheme将是这样的。
<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提出的