Question

我有一个输入字段，如果字段名称中包含youtube，则要使用正则表达式进行检查。

{
QueryResult: {
_rallyAPIMajor: "2",
_rallyAPIMinor: "0",
Errors: [ ],
Warnings: [ ],
TotalResultCount: 1,
StartIndex: 1,
PageSize: 20,
Results: [
{
_rallyAPIMajor: "2",
_rallyAPIMinor: "0",
_ref: "https://rally1.rallydev.com/slm/webservice/v2.0/testfolder/62107128679",
_refObjectUUID: "285c564b-f66a-40e0-88fd-f5c9432d0f34",
_objectVersion: "1",
_refObjectName: "folder2",
Parent: {
_rallyAPIMajor: "2",
_rallyAPIMinor: "0",
_ref: "https://rally1.rallydev.com/slm/webservice/v2.0/testfolder/62107127642",
_refObjectUUID: "ed334288-4815-4472-ab28-bc3cb0030114",
_objectVersion: "1",
_refObjectName: "folder1",
_type: "TestFolder"
},
_type: "TestFolder"
}
]
}
}

在控制器中我有

<input name="videoUrl" ng-pattern="youtubeRegex" required ng-model="video.url" type="text" class="form-control" id="video-link" placeholder="Enter video link from youtube">
<p ng-show="videoForm.videoUrl.$invalid && !videoForm.videoUrl.$pristine">
                                  the link has to be from youtube
                                </p>

但是当我开始输入时，错误会立即显示，即使我从youtube粘贴了一个链接，它仍然会将其验证为错误。

Answer 1

Change your regex to:

$scope.youtubeRegex= /youtube/;

Here's a Plunkr: http://plnkr.co/edit/4Y3RkPccKxxoSQJFf2Zj?p=preview

This will allow you to paste correctly. As far as seeing errors from the get go this is expected behavior since it's technically incorrect as you type. To avoid this you would want to run the error message show when the user is done typing.

This can obviously be done with a submit button but also with ngBlur to determine when the user is done typing and then run a function that checks the validity state of your form and shows/hides a note. Along the same lines you can also use ngModeloptions.debounce.

The concept is the same - check the form validity and show/hide the error element.

正则表达式以角度过滤掉youtube视频

1 个答案: