This is source code.
<div class="thumbnail" ngf-accept="'image/*'" ngf-pattern="'*.jpg,*.jpeg,*.gif,*.png'" ngf-max-size="1MB">
Below the Derective Html Template.
angular.module('ptgui.imagebox',[
'ngFileUpload'
])
.directive('ptguiImagebox', ['$compile', function($compile) {
return {
templateUrl: 'scripts/libs/ptgui/ptgui-imagebox.html',
restrict: 'E',
require: 'ngModel',
scope: {
ngModel: "="
},
replace: true,
link: function ($scope, element, attrs) {
$scope.$watch('ngModel',function(newFile, oldFile){
if (newFile) {
$scope['ngModel'] = newFile;
} else {
$scope['ngModel'] = oldFile;
}
});
}
};
}]);
Below the directive.
When I upload image over max_size, $digest() error comes up consistently below.
and I have one more question. after I find solution that resolve this issue, I will make alert message when someone upload image over max_size.
Thank you your answer.
You shouldn't change your model inside watch since it creates a loop. If you just need to alert when a file is uploaded whether the size is above you can just check the status.
Let's say you have this input:
<input type="file" ngf-select ng-model="picFile" name="file"
accept="image/*" ngf-max-size="1MB" required
ngf-model-invalid="errorFile">
Then you just need to have this in your html to show the limit size exceeded alert:
<i ng-show="myForm.file.$error.maxSize">File too large
{{errorFile.size / 1000000|number:1}}MB: max 1M</i>
And also you don't need a directive to handle that.
Check here for more info around validation.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.