2016-12-15 60 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有關驗證的更多信息。