使用angular怎么监听input输入
这期内容当中小编将会给大家带来有关使用angular怎么监听input输入，文章内容丰富且以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。
成都创新互联公司是一家专注于网站建设、网站设计与策划设计,东平网站建设哪家好?成都创新互联公司做网站,专注于网站建设十载,网设计领域的专业建站公司;建站业务涵盖:东平等地区。东平做网站价格咨询:028-86922220
jsp：
{{username_error}}
这里需要添加ng-app以及ng-controller来规定一个angularApp的范围，再在input标签中添加ng-model属性，让angularjs根据这个属性来监听输入，根据输入把用户提示放到{{username_error}}中
js：
var usernameValid=false;
var registApp =angular.module('regist_app',[]);
registApp.controller('regist_control',function($scope){
$scope.username="";
$scope.username_error="";
var phonePattern=/\D+/;
/*验证号码输入*/
$scope.$watch('username',function(newValue,oldValue){
if(newValue!=oldValue){
if(newValue==""){
$scope.username_error="号码不能为空";
usernameValid=false;
}
else if(phonePattern.test(newValue)){
$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(参数，function)，这个参数就是input的ng-model的值。function的第一个参数是新的值，第二个参数是旧的值，可以判断newValue来给用户相应的提示，结合pattern来判断用户输入是否合法。一个Controller中可以有多个scope.scope.watch(),这里我只贴出一个input的验证方法，其他的都差不多。
usernameValid这个值用来记录当前的input输入是否合法，用于表单提交时根据usernameValid来判断。
上述就是小编为大家分享的使用angular怎么监听input输入了，如果刚好有类似的疑惑，不妨参照上述分析进行理解。如果想知道更多相关知识，欢迎关注创新互联行业资讯频道。
分享文章：使用angular怎么监听input输入
转载来源：
http://cdkjz.cn/article/pcpjps.html
