it's only Angular! No jQuery or other WYSIWYG monsters

For Angular 16 [email protected]

For Angular 15 [email protected]

For Angular 14 [email protected]

For Angular 13 [email protected]

...

Icons are not in the pack! You can use the icons that you like. We recommend to use Material Design Icons

If you do not want to use a full icons set, you can use these steps:

1. go to icons set
2. choose the icon that you want, press the right mouse button on it, and then select the "View SVG" option
3. go to URL-encoder for SVG and use it to convert your SVG

ngx-wig could be simply installed via npm:

npm install ngx-wig

First, import the ngx-wig to your module:

import {NgxWigModule} from 'ngx-wig';

@NgModule({
  imports: [ NgxWigModule ]
});

it's just an attribute directive for textarea:

<link href="https://cdn.materialdesignicons.com/2.1.19/css/materialdesignicons.min.css" rel="stylesheet" />
...
<ngx-wig [content]="text1"></ngx-wig>

<ngx-wig [content]="text1"></ngx-wig>

<ngx-wig [content]="text1" [placeholder]="'Enter instructions here.'"></ngx-wig>

<ngx-wig [(ngModel)]="text1"></ngx-wig>
<ngx-wig [(ngModel)]="text1"></ngx-wig>

<ngx-wig [content]="text1" [buttons]="'bold, italic'"></ngx-wig>

<ngx-wig [content]="text1" (contentChange)="result = $event"></ngx-wig>
<div [innerHTML]="result"></div>

<ngx-wig [formControl]="text1"></ngx-wig>

Please check an example here https://stackblitz.com/edit/ngx-wig-sample-plugins?file=src/app.ts

providers: [{ provide: NgxWigFilterService, useClass: NgxWigFilterStylesService}]

To generate all *.js, *.d.ts and *.metadata.json files:

$ npm run build

To lint all *.ts files:

$ npm run lint

To run all tests:

$ npm run test

MIT © Stepan Suvorov