角度实现输入输入监控的示例

最近注册登录时，需要监控用户的输入来提示用户，使用了angular $watch功能。以下是一个例子：

jsp:

form class=' register Ng-scope ' ng-app=' regist _ app ' on submit=' registSumbitValid()' Ng-controller=' regist _ control ' div class=' item ' input ID=' username ' name=' username ' placeholder='请填写11位数字的手机号码' class=' input-item ' Ng-model=' username ' Pan class=' warning ' { username _ error } }/span/div/form在这里，需要添加Ng-app和Ng-controller来定义一个angulap的范围

js:

var usernameValid=falsevar registApp=angular . module(' regist _ app '，[])；registapp . controller(' regist _ control '，function($ scope){ $ scope . username=' '；$ scope.username _ error=var phone pattern=/\ D/；/*输入*/$范围。$ watch ('username '，函数(新值，旧值){if(新值！=old value){ if(new value==' '){ $ scope。username _ error=' number不能为空'；usernameValid=false} else if (phonepattern。测试(新值)){$ scope。username _ error='只能输入数字'；usernameValid=false} else if(newValue.length！=11){ $scope.username_error='格式不正确，请输入11位数'；usernameValid=false} else if(NewVaLue . length==11){ $ scope . username _ error=' '；usernameValid=true} } });}scope.scope.watch(参数、函数)，是输入的ng-model的值。函数的第一个参数是新值，第二个参数是旧值。可以判断New Value给用户相应的提示，结合模式判断用户输入是否合法。控制器中可以有多个scope.scope.watch()。这里我只贴一种输入的验证方法，其他的都差不多。

usernameValid用于记录当前输入是否合法，提交表单时根据UsernameValid进行判断。

效果截图：

以上角度实现输入监控的例子是边肖分享的全部内容。希望能给大家一个参考，支持我们。