javascript - How to resize text which is dynamically generated from API and input -

i have text dynamically generated api.

if reload page after 5 seconds text appears in <div><h1>mytext</h1></div> , can edit in input.

i'm using plugin http://leandropio.github.io/ng-fi-text/ - see how big text? want resize font of texts have length < 15 10px.

i got code jquery code:

myapp.directive('ng-fix-text', function(){     return {         restrict: 'a',         link: function(scope, element, attrs){             // pseudo jquery code             var text_len = $('.mydiv').find('h1').text().length;             if (text_len < 15){                     $('.mydiv').css('font-size', '10px')         }         }     }; }); 

by way, don't want intefere code inside plugin.

you can access each dom element inside declared directive jquery using element parameter declared in link function. it's operating jquery in fact it's jquery abstraction.

first not forget in angular refer directive it's camel-cased normalized name.

angular normalizes element's tag , attribute name determine elements match directives. typically refer directives case-sensitive camelcase normalized name.

https://docs.angularjs.org/guide/directive

so if named directive ng-fix-text should refer as: ng-fix-text.

here updated code:

myapp.directive('ngfixtext', function() {     return {         restrict: 'a',         link: function(scope, element, attrs) {             var text_len = element.find('h1').text().length;             if (text_len < 15) {                     element.find('h1').css('font-size', '10px')             }         }     }; });