ng-pattern 从角度常数中使用正则表达式答案

【问题标题】：ng-pattern to use regex from angular constantsng-pattern 从角度常数中使用正则表达式
【发布时间】：2016-04-19 17:48:41
【问题描述】：

--短版--

如何让 ng-pattern 从角度常数中使用正则表达式？

--加长版--

我正在处理一个巨大的 Angular 1 项目，我们有多种形式。其中许多表单具有相同的字段，例如 Zip 和 Phone Number。我想寻找一种一致的方式来使用 ng-pattern，但将正则表达式放在一个位置以保持一致性。我想为此使用角度常数，但我无法让 ng-pattern 获取值，我不知道为什么。

--我做了什么--

我确实找到了这个答案 Angularjs dynamic ng-pattern validation 用于将正则表达式动态放入 ng-pattern 中，我尝试过，但该方法似乎不适用于角度常量。

我尝试将正则表达式存储为字符串并将其转换为 HTML。我试过使用返回正则表达式值的函数。

--jsfiddle的问题--

https://jsfiddle.net/Michael_Warner/692deLsb/8/

问题归结为这行代码。

ng-pattern="patterns.zip"

如果我将正则表达式直接嵌入到 ng-pattern 中，那么它将像你在小提琴中看到的那样工作

ng-pattern="/^\d{5}(?:-\d{4})?$/"

【问题讨论】：

标签： angularjs regex validation

【解决方案1】：

您可以通过两种方式做到这一点：

1：作为字符串literal，当你必须双斜杠时：

.constant("formPattern", {
    zip: new RegExp("^\\d{5}(?:-\\d{4})?$")
})

2：作为正则表达式：

.constant("formPattern", {
    zip: /^\d{5}(?:-\d{4})?$/
})

两者都在你的小提琴中工作。

【讨论】：

【解决方案2】：

只需将常量添加到 $scope 变量中

$scope.myPattern = /^\d{5}(?:-\d{4})?$/;

然后在html中

ng-pattern=myPattern

【讨论】：