禁用提交按钮作为默认状态，直到所有输入都以角度js填充

Question

我正在尝试禁用提交表单，直到所有字段都填满为止。

我尝试在按钮中添加config('constants.admin_email'); 选项，但它不起作用。

这是表格：

disable

现在，当我开始输入时按钮被禁用，然后删除输入中的所有内容，当我尝试单击时，它被禁用，但我想要的是按钮从开始时被禁用，然后当你填充时它被解锁或取消禁用的输入（如果这是一个单词）。

请帮助，谢谢！

Answer 1

对于表单状态处理，有角度的文档实际上相当不错：

https://docs.angularjs.org/guide/forms

检查倒数第二个示例，如果电子邮件无效，它们会显示一条消息。

Answer 2

每个输入的每个状态都应反映在范围/控制器中。

所以假设你有这个：

$scope.myInputs = {};

您应该将视图中的每个输入建模为：

ng-model = "myInputs.email";

然后，使用ng-blur / ng-change，您应该遍历$ scope.myInputs对象中的每个属性，以查看是否填充了值。只有这样你才能控制提交的残疾。

Answer 3

我可以通过添加此$pristine属性来解决此问题：

User has not interacted with the field yet.

所以我的按钮现在看起来像这样：

<button class="hvr-bounce-to-right" type="submit" ng-disabled="contactForm.contactName.$dirty && contactForm.contactName.$invalid || contactForm.contactName.$pristine" name="submit-form" ng-click="cu.sendMail()">Enviar mensaje &ensp; <span class="icon flaticon-envelope32"></span></button>

现在它从一开始就被禁用，只有在用户交互并填充（在这种情况下）contactName输入时才启用它。