javascript - ng-模式/ng-显示 AngularJS

Question

我实际上有一个 Angular 形式和一些内部输入。目的是在云端上传文件。因此，我得到了一个目录路径的输入，其中可能包含一些子目录。所以我在我的 JS 上得到了一个正则表达式，范围如下:$scope.regex = "^[^\/]\S+$";

如果第一个字符不是“/”，此正则表达式将接受任何字符。

这是我的 Angular 代码:

<input name="directory" id="directory" type="text" class="form-control" ng-pattern="regex" ng-model="directoryName" placeholder="Enter a directory name"/>

<span class="error" ng-show="uploaderForm.directory.$error.pattern">directory path can't start by a "/"</span>

通常，使用这个正则表达式，这条路径应该是成功的:

directory/subdirectories/filename...

而这个不应该:

/directory/subdirectories/filename...

但我的问题是当我写类似 test/subtest/blablabla 的东西时，我得到了 ng-show 错误...

请注意，我的输入也可以是单个字符，例如 a .

Answer 1

使用

$scope.regex = "^[^/]\\S*$";

或其等效的正则表达式文字表示法:

$scope.regex = /^[^\/]\S*$/;

第一个问题通过将反斜杠加倍来解决。要在 JS 字符串字面量中定义字面量 \，需要将其加倍。参见 this thread .

第二个问题通过用 *(0 或更多)量词替换 +(1 或更多)来解决。 \S+ 匹配一个或多个非空白字符，\S* 将匹配零个或多个非空白字符。

详情

• ^ - 字符串的开始
• [^\/] - /
以外的任何字符
• \S* - 零个或多个非空白字符
• $ - 字符串结尾。

以防万一您还想允许一个空字符串，您可以使用基于前瞻的正则表达式:

$scope.regex = /^(?!\/)\S*$/;

这里，(?!\/) 是一个否定前瞻，如果第一个字符是 /，匹配将失败。