如何在以下場景中禁用AngularJS中的提交？

我在禁用中遇到了一些問題在AngularJS的HTML表單中提交按鈕。如何在以下場景中禁用AngularJS中的提交？

場景：

我選擇從HTML選擇框，即一定的過程。掉落下拉列表
有一次，我選擇的是一些入門，下部是所要求的形式，又具有輸入一組
一旦你在這些填入值，您可以提交自動填充或取消請求

條件：
有在我需要上傳1或列表中的過程更多文件以及其他輸入參數。爲此，我使用兩步法，首先使用按鈕選擇文件，然後使用另一個按鈕上傳文件。點擊這個按鈕進行REST調用，並將文件發送到所需的目標。
我使用ng-file-upload指令從https://github.com/danialfarid/ng-file-upload來完成此操作。

問題：
我最初使用ng-disabled禁用提交對所有必需的輸入件充滿，所有輸入驗證傳遞條件按鈕。現在，當我處於需要上傳文件的用例時，會出現問題。當我選擇一個文件並上傳它時，HTML會將該元素視爲空，因爲該文件已發送到其目標，因此未通過驗證所有必填輸入元素均已填充！如果我刪除此驗證，即使強制字段爲空，我的表單也會提交。

那麼在這種情況下我能做些什麼來禁用我的提交按鈕？

來源

2016-07-17 theHeman

我還沒有在這樣的情況下工作，但我認爲你可以指定布爾值TRUE;一些變量（比如$ scope.flag）當REST的服務回報成功響應。在'ng-submit'函數中，你可以檢查'form。$ valid'是否爲真，'$ scope.flag'爲真，然後提交表單。 –

@ShashankVivek我其實已經試過了。這種情況下的問題就是這種形式。$ valid變成了false。因此該按鈕保持禁用狀態 – theHeman

按照@ShashankVivek的說法創建一個布爾變量。

if file uploaded $ scope.uploaded = true。

所以你的按鈕看起來應該是這樣

<button data-ng-disabled="!form.valid && !uploaded">Submit</button>

來源

2016-07-18 06:10:38

ng禁用和data-ng禁用有什麼區別？ – theHeman

與ng-disabled相比，@ashhem data-ng-disabled更好地通過html5驗證器。使用「data-ng」而不是「ng」是一種更好的做法。 –

如何在以下場景中禁用AngularJS中的提交？

回答

相關問題