angularjs - How can I restrict characters of a md-chip value? -

i using md-chips. want limit character 10.

i tried md-maxlength, 1 custome directive limit characters working in textarea , input not in chips

---

chip limit

---

limits count of chips can add 'chips' model:

<md-chips ng-model="myitems" placeholder="add item" md-max-chips="5"> </md-chips> 

demo: https://jsfiddle.net/suunyz3e/290/

you cannot add more 5 chips input.

unfortunately there's little validation control md-chips directive:

from (angularjs material)

validation

• allow validation callback
• hilighting style invalid chips

---

character chip limit

---

if you're after character limit, can this:

<md-chips ng-model="myitems" placeholder="add item" md-max-chips="5"  md-on-add="validatechip($chip)"> </md-chips> 

controller:

angular.module('sandbox', ['ngmaterial']).controller('testctrl', function($scope) {     $scope.myitems = [];     $scope.validatechip = validatechip;      var characterlimit = 10;     function validatechip($chip) {         if (!$chip) return;         // check if current string length greater or equal character limit.         if ($chip.length >= characterlimit) {             alert('whooaaa, breached limit yo!');             // remove last added item.             $scope.myitems.pop();         }     } }); 

demo: https://jsfiddle.net/suunyz3e/291/