停止提交表格，除非填寫所有字段

Question

我如何驗證表格的角度？因爲我有下面的表格，其中使用https://github.com/danialfarid/ng-file-upload所有的領域是必需的。

問題是，當我點擊提交它顯示一個提示說該字段是必需的，但表單被提交。我想停止提交，除非填寫所有字段。

而我該如何讓用戶只從配置文件輸入中選擇圖像？按鈕時，雖然我加ng-accept="image/*"不工作

<form enctype="multipart/form-data" method="post" > 
<input type="text" ng-model="name" required> 
<input type="text" ng-model="age" required> 
<input type="text" ng-model="title" required> 
<input type="file" name="profile_pic" ng-file-select="onFileSelect" required> 
<input type="file" name="document" ng-file-select="onFileSelect2" required> 
<input type='button' ng-click='onFormSubmit(onFileSelect,onFileSelect)' value='Submit'> 
</form> 

角

angular.module('myApp', ['ngFileUpload']); 

var MyCtrl = [ '$scope', 'Upload', function($scope, Upload) { 
    $scope.onFileSelect = function(file) { 

Upload.upload({ 
    url: 'api/upload-data.php', 
    method: 'POST', 
    file: file, 
    data: { 
     'name': $scope.name, 
     'age' : $scope.age , 
     'title' : $scope.title , 


    } 
}) 

    }; 
}]; 

Answer 1

名稱添加到您的窗體（所以你可以參考它），改變你的堂妹NG-點擊NG-提交表單本身，如果表單無效，則將提交更改爲type =「submit」+ ng-disabled的按鈕元素

<form name="myForm" enctype="multipart/form-data" method="post" ng-submit="onFormSubmit(onFileSelect,onFileSelect)" > 
    <input type="text" ng-model="name" required> 
    <input type="text" ng-model="age" required> 
    <input type="text" ng-model="title" required> 
    <input type="file" name="profile_pic" ng-file-select="onFileSelect" required> 
    <input type="file" name="document" ng-file-select="onFileSelect2" required> 
    <button type="submit" ng-disabled="myForm.$invalid">Submit</button> 
</form>