在 angularjs 中驗證文件上傳

Question

嗨，我正在 angularjs 中開發 Web 應用程序。 我正在開發文件上傳模塊。 我有一個表單，在表單中我有文件上傳控件。 點擊提交（提交表單），如果文件沒有上傳，那么我想讓文件控制為紅色。 我設計了 css 類來使文件控件變為紅色。

 <div class="upload-button bank button1" ng-class="{'has-error': 
      vm.hasFileInputError(myFileID) }">
       <div class="upload-button-icon" >
             <span class="text">{{ 'ID' | translate }}</span>
                    <input type="file" file-modelsr="myFileID" />
       </div>
   </div>

我正在用 javascript 編寫驗證規則。

 $scope.vm = {};
            function hasFileInputError(myFileID) {
                return this.form2.$submitted && this.form2.myFileID.$invalid ||
                  form2.myFileID.$invalid && form2.myFileID.$dirty;
            }

如果文件尚未上傳，則單擊提交按鈕時，我想將文件控件設置為紅色。 這不會發生。 我試圖找出這個問題，但沒有解決。 我可以得到一些幫助來解決這個問題嗎？ 謝謝你。

Answer 1

您已將myFileID傳遞給函數。 那么為什么你需要$form驗證？ 因為如果任何其他字段無效，則form.&dirty總是返回 false。

所以最好改變你的方法就像

vm.hasFileInputError = function (myFileID) {
                return myFileID == undefined || myFileID == '' ? true : false
            }

編輯：

你應該閱讀這個討論： AngularJS - 為什么使用“Controller as vm”？