2016-12-15 58 views
0

这是源代码。

<div class="thumbnail" ngf-accept="'image/*'" ngf-pattern="'*.jpg,*.jpeg,*.gif,*.png'" ngf-max-size="1MB"> 

下面的Derective HTML模板。

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; 
      } 
     }); 

     } 
    }; 
    }]); 

下面的指令。

当我通过max_size上传图片时,$ digest()错误始终在下面出现。

enter image description here

,我有一个问题。 找到解决此问题的解决方案后,我会在有人通过max_size上传图片时发出提醒消息。

谢谢你的回答。

回答

0

您不应该在手表内改变模型,因为它会创建一个循环。如果上传文件时只需要提醒您,无论文件大小是否超过上限,都可以检查状态。

比方说,你有这样的输入:

<input type="file" ngf-select ng-model="picFile" name="file"  
     accept="image/*" ngf-max-size="1MB" required 
     ngf-model-invalid="errorFile"> 

接下来,你需要有这个在你的HTML来显示限制大小超过警报:

<i ng-show="myForm.file.$error.maxSize">File too large 
     {{errorFile.size/1000000|number:1}}MB: max 1M</i> 

,你也不必处理该问题的指令。

检查here有关验证的更多信息。