當未填寫必填字段時，不調用角提交

Question

我正在用Ionic在Angular中創建一個表單。 我不希望顯示紅色錯誤類，除非用戶提交了表單。 因此，我的代碼如下所示：

<form ng-submit="submit()" name="form">
     <ion-radio ng-repeat="item in items" ng-model="data.type" name="type" ng-value="item.value" ng-class="{'error' : form.type.$invalid && formSubmitted }"
</form>

然后在我的控制器中

$scope.submit = function ()
{
   $scope.formSubmitted = true; //Tell our errors they can show now
}

因此，僅當formSubmitted為true時，錯誤類才應顯示。 但是，無論出於何種原因，都required阻止submit被調用。 其他屬性（例如minlength）則不是這種情況。

如何獲得我想要的行為？

Answer 1

您需要在表單中添加novalidate 。

原因是，您的瀏覽器正在驗證您的表單，而不是讓您的代碼來執行它。

或者，執行以下操作：

<form ng-submit="submit()" name="form" novalidate>
     <ion-radio ng-repeat="item in items" ng-model="data.type" name="type" ng-value="item.value" ng-class="{'error' : form.type.$invalid && form.$submitted }"
</form>

form.$submitted將在您提交時變為true。