AngularJs textAngular taMaxText, ctrl.$validators return undefined

Question

I try to use textAngular taMaxText attribute, in my jsp, the code is

<div text-angular ta-target-toolbars="toolbar2" ng-model="inpt.msgCntnText"  name = "test" ta-max-text="2" ></div>

then I set breakpoint in textAngular.js, and in ctrl.$validators.taMaxText, I see ctrl.$validators returns undefined,

angular.module('textAngular.validators', [])
.directive('taMaxText', function(){
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function(scope, elem, attrs, ctrl){
            var max = parseInt(scope.$eval(attrs.taMaxText));
            if (isNaN(max)){
                throw('Max text must be an integer');
            }
            attrs.$observe('taMaxText', function(value){
                max = parseInt(value);
                if (isNaN(max)){
                    throw('Max text must be an integer');
                }
                if (ctrl.$dirty){
                    ctrl.$validate();
                }
            });
            ctrl.$validators.taMaxText = function(viewValue){ <-- error here!!
                var source = angular.element('<div/>');
                source.html(viewValue);
                return source.text().length <= max;
            };
        }
    };

so it throws

TypeError: Cannot set properties of undefined (setting 'taMaxText')

how to make it work?