框架:
AngularJS + angular-material
目标:当字数超过限制值时,input无法再输入
html:
<input type="text" ng-model="name" input-limit="30"
aria-label="input" name="name" placeholder="长度限制为30个字" />
js指令:
app.directive("inputLimit",function () {
return{
restrict:'A',
scope:{
model : '=ngModel'
},
link:function (scope,elm,attrs) {
scope.$watch('model', function(newValue, oldValue) {
if(newValue == undefined){
scope.model ='';
}else{
if(scope.model.length > Number(attrs.inputLimit)){
scope.model = oldValue;
return false;
}
}
});
}
}
});