Question

我想验证具有特定条件的电子邮件字段。仅当在文本字段中输入电子邮件ID时，才应启用提交按钮。以gmail.com（例如，xyz @ gmail.com）结尾。

演示：http://plnkr.co/edit/lVCGIr3rSajseLeC5hUx?p=preview

示例代码：

timeb

上面的代码将在有效的电子邮件ID的情况下启用提交按钮，但是只有当键入的电子邮件ID以gmail.com结尾时，如何限制它以启用提交按钮

有输入吗？

我尝试使用以下脚本，但是正则表达式仅告诉电子邮件地址中的合法字符。

<input type="text" name="user" ng-model="shareSelectionFormFields.user" required>

<span class="error" ng-show="myForm.user.$dirty && myForm.user.$invalid">
    <span ng-show="myForm.user.$error.required">Username is required. 
    </span>
</span>

<input type="submit" 
       ng-disabled="(myForm.user.$dirty && myForm.user.$invalid) ||
                    (myForm.email.$dirty && myForm.email.$invalid) ||
                    (myForm.recipientEmail.$dirty &&
                     myForm.recipientEmail.$invalid) ||
                    myForm.$invalid" />

Answer 1

您可以使用ng-pattern并为其设置正则表达式/^[A-Za-z0-9._%+-]+@gmail.com$/。

因此您的input将是：

<input type="email" name="email" ng-model="shareSelectionFormFields.email"
       ng-pattern="/^[A-Za-z0-9._%+-]+@gmail.com$/" required />

以下是有效的演示代码：

http://plnkr.co/edit/UtSPI5pgXbqc5QUwfWI8?p=preview

Answer 2

在angularjs中，您可以使用指令threadIdx blockDim来匹配模式并验证字段。

在您的正则表达式内部，只需更改正则表达式的末尾以仅包含@ gmail.com。

最终代码应如下所示：

int total_threads = blockDim.total_blocks * theadIdx.total_threads

然后，您可以具有一个按钮，该按钮根据字段的有效性指定<<<N,M>>> // total_threads would be equivalent to: N * M指令，如下所示：

ng-pattern

这里是<input type="text" name="user" ng-model="shareSelectionFormFields.user" ng-pattern="^\w+([\.-]?\w+)*@gmail.com" required />文档的链接：

ng-pattern documentation

仅在条件有效时启用按钮

2 个答案: