angularjs - How to change maxlength value in angular -

i'm new angular. im trying change value of maxlength 300 140 on click. buttons loaded using ng-repeat , first 1 1 that's supposed change value 140, rest should go 300.

here's have in controller:

//character counter $scope.counter = function() {     var myel = angular.element(document.queryselector('.form-control'));     myel.attr('maxlength', '150'); }; 

and html this:

 <textarea data-ng-model="view.post.content" ng-trim="false" maxlength="340" class="form-control" style="height: 100px;"></textarea> 

just use ng-maxlength , bind property on scope, provide validation safety.

example:-

 <textarea data-ng-model="view.post.content" ng-trim="false"              ng-maxlength="maxvalue" class="form-control"              style="height: 100px;"></textarea> 

if want restrict use interpolation maxlength={{maxvalue}}. i.e

 <textarea data-ng-model="view.post.content" ng-trim="false"              maxlength="{{maxvalue}}" class="form-control"              style="height: 100px;"></textarea> 

so $scope.maxvalue = 340 , set inside counter value of property 150.

doc

ngmaxlength (optional) number : sets maxlength validation error key if value longer maxlength. setting attribute negative or non-numeric value, allows view values of length.

example