An Angular4.* directive to auto-scale the font-size of an element to fit it's parent element.
npm install ng4-fittextAngular4 directive (typescript) to do what fittext.js did when jquery was cool.
Basically, This auto-scales the font size to fit the width of it's container.
coming soon
Install the library
``sh`
$ npm install --save ng4-fittext
Import it in your Angular4 project like a module
1) Declare it in your module
`sh`
import {Ng4FittextModule} from 'ng4-fittext';
@NgModule({
imports: [
Ng4FittextModule
]
})
`
2) Use it in your components
The element that contains this directive should have a CSS width!
sh
import {Component} from '@angular/core';
@Component({
selector: 'hero',
template:
})
export class HeroComponent {}
` Parameters:
| Parameter | Description | Values |
| --- | --- | --- |
|
[fittext] (required) | Selector for the directive. It accepts a boolean value but defaults true. You can disable the directive for this element by passing in false. But why? just remove it to disable. | boolean (default true)
| [container] (required) | Your fittext elements parent. Must be a div | ElementRef ()
| [activateOnResize] (optional) | enable/disable the auto-scale in case of window resize | boolean (default true)
| [compression] (optional) | compression rate. How fast should the text resize | number (default 1)
| [minFontSize] (optional) | minimum font size allowed on element | number (default -infinity)
| [maxFontSize]` (optional) | maximum font size allowed on element | number (default bitSize limit)Want to contribute? Great!
Simply, clone the repository!
fittext.js was pretty useful up until nobody liked jquery anymore. There was an existing ng-1 lib and a sketchy ng-2 directive. This should take care of ng-4+.
- Write tests
License
----
ISC
- Rich