How to customize Froala in angular 2?

Question

I have added the Froala editor in my Angular 2 app and it works, I just cant find how to customize the toolbar, to show buttons that I want (bold, italic, underline, etc), any help?

https://github.com/froala/angular2-froala-wysiwyg

Answer 1

You can add option like this:

<div 
    *ngIf="homeIsInEditMode" 
    [froalaEditor]="options" 
    [(ngModel)]="homeMessage.libelleMessage"> 
</div>

And in component add options you want:

public options: Object = {
    placeholderText: 'Edit Your Content Here!',
    charCounterCount: false,
    toolbarButtons: ['bold', 'italic', 'underline', 'paragraphFormat','alert'],
    toolbarButtonsXS: ['bold', 'italic', 'underline', 'paragraphFormat','alert'],
    toolbarButtonsSM: ['bold', 'italic', 'underline', 'paragraphFormat','alert'],
    toolbarButtonsMD: ['bold', 'italic', 'underline', 'paragraphFormat','alert'],
}

You can get more details in the official documentation.