Textarea Maxlength AngularJS

A maxlength directive that employs parsers and attempts to get the job done in an "angularesque" manner.

HTML

<div class="parent" ng-app="myApp">
    <h1>Textarea Maxlength = 5.</h1>
    <h3>Open the console to see debug info.{{textareaTextl}}</h3>
    <label for="text">Textarea label</label>:
    <textarea id="text" cols="40" rows="5" ng-model="textareaText" ng-change="onTextChange()"></textarea>
    <br/><br/>
    <div>This option now works great because I'm using the $set method in the AngularJS attrs object to turn off ngTrim. Even adding spaces at the end of the string are truncated as expected.</div>
    <br/><br/>
    <div>Model Value=<span class="model">[{{textareaText}}]</span></div>
    
</div>

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js"></script>
<style>
.parent { background-color:tan; }
.model {font-weight:bold;}

JavaScript

(function () {
    'use strict';
    var myAppModule = angular.module('myApp', []);
    myAppModule.controller('MyController', function($scope) {
        $scope.textareaText = "f";
        $scope.isCool= false;
        $scope.onTextChange = function() {
        	$scope.isCool = true;
        };
    });
    
})();