[英]How to debug ng-pattern
I'm working on custom form validation for an Angular application using ng-pattern
. 我正在使用
ng-pattern
为Angular应用程序定制表单验证。
In my form I have: 在我的表格中,我有:
<form name="jobsForm" id="jobs-form">
<div jobs-form jobs="jobs">
<div ng-form="jobsForm">
<div class="form-group">
<label for="source_path">Source Path:</label>
<input type="text" class="form-control" name="source_path" id="source_path" ng-model="jobs.source_path" ng-pattern="path_regex" required>
<span class="input-error" ng-show="jobsForm.source_path.$invalid.pattern">INVALID PATH</span>
</div>
</div>
</div>
<button type="submit" class="btn btn-primary-red" ng-click="submitJob()">Submit</button>
</form>
In my controller I define path_regex
: 在我的控制器中,我定义
path_regex
:
$scope.path_regex = /^[a-zA-Z]:\\(((?![<>:"\/\\|?*]).)+(\\)?)*$/;
When I try it out, nothing works. 当我尝试时,没有任何效果。 What is the best way to debug this?
调试此问题的最佳方法是什么? Is it possible to put a breakpoint in and check my values for
ng-show
? 是否可以设置断点并检查
ng-show
值?
For sure you can. 当然可以。 If you look at the angularJS documentation for ng-pattern and then click on the " View Source " button at top right, you will see the source code.
如果您查看ng-pattern的angularJS文档,然后单击右上方的“ 查看源代码 ”按钮,您将看到源代码。 There isn't much to this directive.
该指令没有太多内容。 Search for this code:
搜索此代码:
ctrl.$validators.pattern = function(modelValue, viewValue) {
// HTML5 pattern constraint validates the input value, so we validate the viewValue
return ctrl.$isEmpty(viewValue) || isUndefined(regexp) || regexp.test(viewValue);
};
So you can see there is a function being assigned to the array of $validators on the model controller. 因此,您可以看到在模型控制器上有一个分配给$ validators数组的函数。 When data changes, all of the $validators will be executed.
数据更改时,将执行所有$ validators。
Now go to the chrome debugger, sources panel and search for one of these lines of code and in your un-minified angular.js file. 现在转到chrome调试器的“ sources”面板,并在未缩小的angular.js文件中搜索这些代码行之一。 Put a breakpoint in this same function to make sure that your regex gets to the test.
在相同的函数中放置一个断点,以确保您的正则表达式可以通过测试。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.