Frank Mehlhop
Frank Mehlhop

Reputation: 2222

Froala editor hide image edit option in Angular 6

i use the Froala editor inside a popup at a angular 6 application. The feature insertImage should be disabled (not visible). The Froala div looks like that:

<div id="froala-editor" [froalaEditor]="froalaOptions" (froalaInit)="initFroala($event)">Hello, Froala!</div>

At the js (typescript) I set (without insertImage):

    public initFroala(froala) {
    $('#froala-editor').froalaEditor({
        toolbarButtons: ['fullscreen', 'bold', 'italic', 'underline', 'strikeThrough', 'subscript', 'superscript', '|', 
        'fontFamily', 'fontSize', 'color', 'inlineStyle', 'paragraphStyle', '|', 'paragraphFormat', 'align', 
        'formatOL', 'formatUL', 'outdent', 'indent', 'quote', '-', 'insertLink', 'insertVideo', 'insertFile', 'insertTable', '|', 
        'emoticons', 'specialCharacters', 'insertHR', 'selectAll', 'clearFormatting', '|', 'print', 'help', 'html', '|', 'undo', 'redo']
    });
}

But the insertImage-Button is still there. How to enable the insertButton?

Thanks for help. Frank

Upvotes: 1

Views: 1420

Answers (1)

Sam
Sam

Reputation: 46

You can add the list of tool bar buttons in the froalaOptions options that you are passing.

In typescript

froalaOptions: any = {
       toolbarButtons: [
        'align',
        'color',
        'fullscreen',
        'bold',
        'italic']
}

pass this options to Froala editor

<div id="froala-editor" [froalaEditor]="froalaOptions" (froalaInit)="initFroala($event)">Hello, Froala!</div>

So to remove the insertImage button you need just need not add that into this list of toolbar buttons.

Upvotes: 1

Related Questions